非常简单D3:如何绘制弧? [英] Very Simple D3: How to Draw an Arc?
问题描述
这将是很高兴学习D3。看了很多例子后,我想我明白了。我的第一个项目是制作一个色轮,没有过渡为简单。但它似乎即使是不够简单,我的第一个项目!对于项目零,我试图得到的东西显示在屏幕上。希望我写的东西(亲爱的阅读已经固定),而不是一个例子。
It would be nice to learn D3. After reading many examples, I think I understand it. My first project is to make a color wheel, without transitions for simplicity. But it appears even that is not simple enough for my first project! For project zero, I am trying to get something to show on the screen. Hopefully something I wrote (and dear read has fixed), and not an example.
我做错了什么? http://jsfiddle.net/aGdMX/1/
var arc = d3.svg.arc()
.innerRadius(40)
.outerRadius(100)
.startAngle(0)
.endAngle(1)
;
var chart = d3.select("body").append("svg:svg")
.attr("class", "chart")
.attr("width", 420)
.attr("height", 420).append("svg:g")
.attr("transform", "translate(200,200)")
;
chart.selectAll("path")
.data(data)
.enter().append("svg:path")
.attr("fill", function(d, i){
return d3.rgb("black");
})
.attr("d", arc)
;
谢谢
推荐答案
此处的示例没有定义任何数据。如果你只想静态绘制svg,跳过selectAll()和data()绑定:
Your example here doesn't have any data defined. If you just want to draw the svg statically, skip the selectAll() and data() bindings:
chart
.append("svg:path")
.attr("fill", function(d, i){
return d3.rgb("black");
})
.attr("d", arc)
;
或定义一些数据并使用它来驱动绘图:
Or define some data and use that to drive the drawing:
http://jsfiddle.net/findango/aGdMX/2/
(加上 .attr(fill
...应为 .style fill
...)
(plus .attr("fill"
... should be .style("fill"
...)
这篇关于非常简单D3:如何绘制弧?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!