IE 8 で動作する円グラフを描画する必要があるため、d34raphael を使用しています。
現在、これは私のコードで、d3 円グラフの例から変更されています https://raw.github.com/mbostock/d3/master/examples/pie/pie.html
var width = 300,
height = 300,
outerRadius = Math.min(width, height) / 2,
innerRadius = outerRadius * .6,
data = d3.range(10).map(Math.random),
color = d3.scale.category20(),
donut = d3.layout.pie(),
arc = d3.svg.arc().innerRadius(innerRadius).outerRadius(outerRadius);
// #chart is a div
var paper = new Raphael($('#chart')[0], width, height);
var svg = d3.raphael(paper);
paper.setStart();
var vis = svg.selectAll('rect')
.data([data])
.enter().append('rect')
.attr('x', 0)
.attr('y', 0)
.attr('width', width)
.attr('height', height);
svg.selectAll('path')
.data(donut)
.enter().append('path')
.attr('fill', function(d, i) { return color(i); })
.attr('d', arc)
.attr('transform', 'translate(' + outerRadius + ',' + outerRadius + ')');
paper.setFinish().transform(['t', 0, 0]);
ドーナツをデータ関数に渡すとクラッシュします.d3のデータ関数内のバインド関数にはgroup
引数があります。group
データ関数をステップ実行した後、未定義であることがわかりました。(私にとっては、 d3.v2.js:4997 でクラッシュし、 undefinedbind(group = this[i], value.call(group, group.parentNode.__data__, i));
を参照しようとします)これは、ラファエルが g タグをサポートしていないことに関連していると思います。d34raphael で d3 パイ レイアウトを使用する方法についてのアイデアはありますか? ありがとうparentNode
group