[D3] Adding SVG Elements

Circle Example

假設有這段code:

<div class="svg_by_d3"></div>

在 div.svg_by_d3 裡新增一個 svg 的圓形:

var divSelection = d3.select(".svg_by_d3");

var svgSelection = divSelection.append("svg").attr("width", "50").attr("height", "50");

var circleSelection = svgSelection.append("circle").attr("cx", "25").attr("cy", "25").attr("r", "25").style("fill", "blue");

最後會產生出以下:

<div class="svg_by_d3">
  <svg width="50" height="50">
    <circle cx="25" cy="25" r="25" style="fill: rgb(0, 0, 255);"></circle>
  </svg>
</div>

您可在此處留言

avatar

這個網站採用 Akismet 服務減少垃圾留言。進一步瞭解 Akismet 如何處理網站訪客的留言資料

  Subscribe  
Notify of