d3.js与属性的百分比，而不是像素

Question

设置在创建中d3.js的对象，这是我经常的做法：

var svgcanvas = d3.select("body") 
        .append("svg") 
        .attr("width", 100) 
        .attr("height", 100) 
        .append("circle") 
        .attr("cx", 50) 
        .attr("cy", 50) 
        .attr("r", 10) 
        .attr("fill", "red") 

它会在年底完全静态的对象。我想要做的是有这样的事情（注意百分比）：

var svgcanvas = d3.select("#tweets") 
        .append("svg") 
        .attr("width", 100%) 
        .attr("height", 100%) 
        .append("circle") 
        .attr("cx", 50%) 
        .attr("cy", 50%) 
        .attr("r", 10) 
        .attr("fill", "red") 

但它似乎不可能。

手动创建svg元素时，这样做就像一个魅力。这里是一个例子 http://cssdeck.com/labs/jxda8sth

对于这样一个天真的解决方案，挖掘自动缩放脚本是一个禁忌我。所以我想问一下：是否可以用一个几乎只有css的解决方案来完成它（如上面的解决方案）？

Answer 1

将值放在双引号中，例如“100％”

var svgcanvas = d3.select("body") 
        .append("svg") 
        .attr("width", "100%") 
        .attr("height","100%") 
        .append("circle") 
        .attr("cx", "50%") 
        .attr("cy", "50%") 
        .attr("r", "10%") 
        .attr("fill", "red") 

而作为一个jsfiddle