1

円を描くように配置したいdivに追加する5つの画像があります。これは、関心のあるdivに5つの画像を添付するコードの概要です。

diseases = ['d1', 'd2', 'd3']

images = d3.select('#welcome-container').selectAll('svg')
    .data(diseases).enter()
    .append('img')
    .attr('src', function(d) {return 'images/' + d + '_icon.png'})
    .attr('class', 'disease_icon')
    .attr('value', function(d) {return d})

結果は、クラスの結果として指定された高さ/幅でラインブロックに配置された画像です。.cssまたはJSのこの部分に対して、円を描くように方向付けるためにできることはありますか？ありがとう、

4

1 に答える 1

4

私の知る限り、これを自動的に行う CSS はありません。ただし、画像を手動で配置するのはそれほど難しくありません。たとえば、インデックスに従って個々の画像を変換できます。

.attr("transform", function(d, i) {
  return "translate(" + (Math.cos(2*Math.PI/diseases.length*i)*radius) +
         "," + (Math.sin(2*Math.PI/diseases.length*i)*radius) + ")";
})
于 2012-06-13T07:43:49.353 に答える