D3 - 添加一个原始符号 [英] D3 - Add a raw symbol

问题描述

我有一个 D3 代码。

我要添加一个svg符号as is！到 D3 svg。

我不想使用D3动态创建符号，从我们的设计师，我想要使用它，因为！

这是我的jsfiddle： https://jsfiddle.net/omriman12/8786e8zq/1/

在小提琴我有我的d3容器 pie_chart_wrapper ，我想向d3 svg

添加符号 md_file h2_lin>解决方案

只需向SVG添加前面定义的符号：

  svg.append g）
 .attr（transform，translate（0,0））
 .attr（class，mySymbol）
 .append 
 .attr（xlink：href，＃md_file）
  

这里的工作代码

追加使用，您可以调整其属性，例如：

  svg.append（g）
 .attr（transform，translate（0,0））
 .attr（class，mySymbol）
 .append（use）
。 attr（width，20）
 .attr（heigth，20）
 .style（fill，red）
。 
。 
。 
 .attr（xlink：href，＃md_file）
  

I have a D3 code.

I want to add a svg symbol "as is"! to the D3 svg.

I dont want to create the symbol dynamically using D3, I have the symbols already made from our designer and i want to use it as is!

This is my jsfiddle: https://jsfiddle.net/omriman12/8786e8zq/1/

In the fiddle I have my d3 container pie_chart_wrapper and i want to add the symbol md_file to the d3 svg

解决方案

Just add previous definded symbol to your SVG:

svg.append("g")
   .attr("transform","translate(0,0)")
   .attr("class","mySymbol")
   .append("use")
   .attr("xlink:href","#md_file")

Here the working code

After append use your can tweak their attributes, like so:

svg.append("g")
   .attr("transform","translate(0,0)")
   .attr("class","mySymbol")
   .append("use")
   .attr("width",20)
   .attr("heigth", 20)
   .style("fill", "red")
       .
       .
       .
   .attr("xlink:href","#md_file")

这篇关于D3 - 添加一个原始符号的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！