は、次のコードでドーナツ

Question

外伝説とドーナツグラフをd3.js、私はその右側に、ドーナツ外ドーナツの伝説を置くしたいと思います：

ラインコードは、私がやって変更する必要があります

http://bl.ocks.org/juan-cb/1984c7f2b446fffeedde

それ？これと同じ

var legend = svg.selectAll('.legend') 
    .data(color.domain()) 
    .enter() 
    .append('g') 
    .attr('class', 'legend') 
    .attr('transform', function(d, i) { 
     var height = legendRectSize + legendSpacing; 
     var offset = height * color.domain().length/2; 
     var horz = -3 * legendRectSize; 
     var vert = i * height - offset; 
     return 'translate(' + horz + ',' + vert + ')'; 
    }); 

legend.append('rect') 
    .attr('width', legendRectSize) 
    .attr('height', legendRectSize) 
    .style('fill', color) 
    .style('stroke', color); 

legend.append('text') 
    .attr('x', legendRectSize + legendSpacing) 
    .attr('y', legendRectSize - legendSpacing) 
    .text(function(d) { return d; }); 

何か：

http://www.jqueryscript.net/demo/jQuery-Plugin-To-Convert-Tabular-Data-Into-Donut-Charts-Chart-js/

編集：解決策は、水平方向と垂直方向の座標を変えるだけの問題でした。複雑なものは必要ありません。

Answer 1

これら2つの変数：

var horz = -3 * legendRectSize; // X-axis translation. 
var vert = i * height - offset; // Y-axis translation. 

あなたはHORZとヴェール変換するための式を修正することができます。

var horz = 30 * legendRectSize; // Will be right side of the donut chart. 
var vert = i * height - offset; // Still at the middle of the donut chart vertically.