下面的代码是用来绘制五个并排的圆
<head>
<script type='text/javascript' src='jquery-2.0.3.min.js'></script>
<script type='text/javascript' src='knockout-2.3.0.js'></script>
<script type='text/javascript' src='knockout-2.3.0.js'></script>
<script type='text/javascript' src='knockout-2.3.0.js'></script>
<script src="bootstrap.min.js"></script>
<!-- Bootstrap -->
<link href="bootstrap.min.css" rel="stylesheet" media="screen">
<link href="sticky-footer.css" rel="stylesheet">
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
</head>
<body>
<div id="viz"></div>
<script type="text/javascript">
var dataset = [],
i = 0;
for(i=0; i<5; i++){
dataset.push(Math.round(Math.random()*100));
}
var sampleSVG = d3.select("#viz")
.append("svg")
.attr("width", 400)
.attr("height", 400);
sampleSVG.selectAll("circle")
.data(dataset)
.enter().append("circle")
.style("stroke", "gray")
.style("fill", "black")
.attr("height", 40)
.attr("width", 75)
.attr("x", 50)
.attr("y", 20);
</script>
</html>
这不是我的代码，我只是从这个网站复制的 http://christopheviau.com/d3_tutorial/
问题是这段代码没有画任何圆圈。 虽然当我尝试使用 chrome 的工具检查元素时，我发现圆圈在那里但它们不可见。
我认为原因是圆圈的颜色是白色的，尽管笔划不是。 然而，改变颜色并不是很有用。
问题是 Dreamweaver 并没有像它对 HTML 或 JavaScript 那样真正提供帮助。
对于这个问题的解决有什么建议，或者对编辑有什么建议吗？
最佳答案
看起来您举了一个生成矩形并将其更改为圆形的示例，但圆形没有 x、y、高度和宽度属性，它们具有 cx, cy and radius attributes instead .
sampleSVG.selectAll("circle")
.data(dataset)
.enter().append("circle")
.style("stroke", "gray")
.style("fill", "black")
.attr("r", 40)
.attr("cx", 50)
.attr("cy", 20);
将在另一个之上绘制多个圆圈。
关于html - 使用D3画圆，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18250263/