d3.symbol D3.js符号生成器

d3.symbol D3.js符号生成器

api版本 5.X

d3中有7个符号生成器。

1. symbolCircle 圆形
2. symbolCross 十字架
3. symbolDiamond 菱形
4. symbolSquare 正方形
5. symbolStar 五角星
6. symbolTriangle 三角形
7. symbolWye Y形

内置这几个形状有什么用啊，太简单了。

下面我们来绘制一个五角星

this.svg.append('g')
        .attr("transform", "translate(" + this.pieCenterX + "," + this.pieCenterY + ")")
        .append('path')
        .attr('d',d3.symbol().type(d3.symbolStar).size(400))
        .attr('fill','red')

.type :参数是上面写的7中形状
.size：单位是像素的平方，默认是64就是8*8的大小。
绘制的结果是一个红色的五角星。

注意d3.symbol().type(d3.symbolStar).size(400)这种写法是5.X的，前面几个版本不这样写。