2013-02-27 3 views
6

Было бы неплохо узнать D3. Прочитав много примеров, я думаю, что понимаю. Мой первый проект - сделать цветовое колесо без переходов для простоты. Но, похоже, это не так просто для моего первого проекта! Для нулевого проекта я пытаюсь показать что-то на экране. Надеюсь, что-то я написал (и дорогой читал зафиксирован), а не пример.Очень простой D3: Как рисовать дугу?

Что я сделал не так? 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) 
    ; 

Спасибо

ответ

11

Ваш пример здесь не имеет каких-либо данных, определенные. Если вы просто хотите, чтобы сделать SVG статический, пропустите SelectAll() и данные() привязки:

chart 
    .append("svg:path") 
    .attr("fill", function(d, i){ 
     return d3.rgb("black"); 
    }) 
    .attr("d", arc) 
    ; 

Или определить некоторые данные и использовать, чтобы управлять рисунком:

http://jsfiddle.net/findango/aGdMX/2/

(плюс .attr("fill" ... должно быть .style("fill" ...)

+0

Благодарим вас за рабочую ссылку jsfiddle. Я разочарован, что могу сделать больше одной ошибки на таком простом примере. –