使用變換來定位我不成材的正確途徑

Question

隨機數據

var data = [53245]; 
    var data2 = [28479, 234234]; 
    var data3 = [19697]; 
    var data4 = [41123,12313]; 

寬度&畫布的高度

var w = 960, 
     h = 500, 
     r = Math.min(w, h)/2, 
     donut = d3.layout.pie().sort(null), 

這裏是我決定我有多大希望一個弧是

arc = d3.svg.arc().innerRadius(r - 100).outerRadius(r - 20).startAngle(-2).endAngle(-1.34), 
arc2 = d3.svg.arc().innerRadius(r - 100).outerRadius(r - 20).startAngle(-1.34).endAngle(-0.68), 
arc3 = d3.svg.arc().innerRadius(r - 100).outerRadius(r - 20).startAngle(-0.68).endAngle(-0.02), 
arc4 = d3.svg.arc().innerRadius(r - 100).outerRadius(r - 20).startAngle(-0.02).endAngle(0.64), 
arc5 = d3.svg.arc().innerRadius(r - 100).outerRadius(r - 20).startAngle(0.64).endAngle(1.3), 
arc6 = d3.svg.arc().innerRadius(r - 100).outerRadius(r - 20).startAngle(1.3).endAngle(1.96), 

我試過使用轉換，但我的形狀倒過來。我希望它是一個不是U形的弧。

var svg = d3.select("body").append("svg:svg") 
    .append("svg:g") 
     .attr("transform", "translate(700,400) scale(1, -1)"); 

的顏色等的路徑

var arcs = svg.selectAll("path") 
     .data(donut(data)) 
     .enter().append("svg:path") 
      .attr("fill", function(d, i) { return 'blue'; }) 
      .attr("d", arc) 
     .data(donut(data2)) 
      .enter().append("svg:path") 
       .attr("fill", function(d, i) { return 'green'; }) 
       .attr("d", arc2) 
     .data(donut(data3)) 
      .enter().append("svg:path") 
       .attr("fill", function(d, i) { return 'pink'; }) 
       .attr("d", arc3) 
     .data(donut(data4)) 
      .enter().append("svg:path") 
       .attr("fill", function(d, i) { return 'black'; }) 
       .attr("d", arc4) 

    .data(donut(data4)) 
      .enter().append("svg:path") 
      .attr("fill", function(d,i) {return 'yellow';}) 
      .attr("d",arc5) 

    .data(donut(data4)) 
      .enter().append("svg:path") 
      .attr("fill", function(d,i) {return 'orange';}) 
      .attr("d",arc6) 

Answer 1

我已經解決了它自己：

.attr("transform", "translate(700,450) rotate(180) scale(-1, -1)") 

簡單地添加旋轉&改變規模:)