javascript - 我们可用的 d3 符号列表

Question

我在哪里可以找到 d3.js 提供给我们的符号列表，这是由这行代码引用的:

 d3.svg.symbol().type(/*Name of the symbol type that is available to us to use*/'triangle')

一些可用的符号包括三 Angular 形、菱形。在记录整个列表的任何地方是否有可用的文档。

Answer 1

对于版本 4，有七个形状，而版本 3 中有六个(在另一个答案中引用)。

形状包含在数组 d3.symbols 中，其中包含:

• d3.symbolCircle
• d3.symbolCross
• d3.symbolDiamond
• d3.symbolSquare
• d3.symbolStar(版本 4 新增)
• d3.symbolTriangle(与 v3 中的 2 个相比，v 4 中只有一个三 Angular 形)
• d3.symbolWye(“y”形符号，版本 4 中的新符号)

像往常一样，d3 文档涵盖了 the topic well here .

为了显示符号，以及如何使用数组动态设置形状，我在下面附上了一个片段:

var data = [0,1,2,3,4,5,6];
var svg = d3.select('body').append('svg').attr('width',400).attr('height',200);

svg.selectAll('.symbol')
   .data(data)
   .enter()
   .append('path')
   .attr('transform',function(d,i) { return 'translate('+(i*20+20)+','+30+')';})
   .attr('d', d3.symbol().type( function(d,i) { return d3.symbols[i];}) );

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.5.0/d3.js"></script>