Symbol
var dataSet = [];
var svg = d3.select("body").append("svg").attr("width",600).attr("height",600);
for (var i = 0;i<10;i++){
dataSet.push({
size:Math.random()*30+120,
// 快速生成随机角标 d3.svg.symbolTypes中是d3所支持的符号数组
type:d3.svg.symbolTypes[Math.floor(Math.random()*d3.svg.symbolTypes.length)]
})
}
var symbolPath = d3.svg.symbol().size(function (d) {
return d.size;
}).type(function (d) {
return d.type;
});
var color = d3.scale.category10();
svg.selectAll("path").data(dataSet).enter().append("path").attr("d",function (d) {
return symbolPath(d);
}).attr("transform",function (d,i) {
var x = 50+i%5*20;
var y = 50+Math.floor(i/5)*20;
return "translate("+x+","+y+")";
}).attr("fill",function (d,i) {
return color(i);
})
结果: