我有一个地图变量，我需要用它在d3.js中绘制饼状图

i have a map variable i need to use that to draw a pie chart in d3.js

本文关键字：js d3 绘制 地图 有一个 变量      更新时间：2023-09-26
 var map = new object();
 var pie = d3.layout.pie().value(function(d) { return d ;} );
 var arcs =group.selectAll(".arc").data(pie(JSON.parse(map))) 
           .enter().append("g")
           .attr("class","arc");
 arcs.append("path")
 .attr("d",arc)
 .attr("fill" , function (d) { return color(d.map ); });
 arcs.append("text")
 .attr("transform", function(d){ return "translate(" +arc.centroid(d)+       
 ")";})
 .attr("text-anchor","middle")
 .attr("font-size","1.5em")
 .text(function(d){ return d.data; });
 arcs.append("text")
    .attr("dx", function(d){return -100;})
 .attr("dy", function(d){return 9;})
    .text(function(d){return totalmails+" mails in last 7days";})
.attr("font-size","1.5em")
.attr("fill","black");

my map变量包含以下数据…

 Object {URGENT: 10, NORMAL: 20, FYI: 30}...

我需要用这个来画饼状图。在这里，我尝试使用json解析来绘制饼。所以请建议如何绘制饼json数据使用json之前，我试图用一个数组的数字绘制。现在我需要使用json绘制，这是在这种形式的Object {URGENT: 10, NORMAL: 20, FYI: 30}，需要绘制键紧急，正常，仅供参考

实际上我在你的代码中看不到任何JSON数据。map变量只是一个对象。包含数据的JSON看起来像以下字符串:

var map = '{"URGEND":10,"NORMAL":20,"FYI":10}';

如果有更改JSON的选项，更好的piecharts布局应该是:

var map = '[{"name":"URGEND","value":10},{"name":"NORMAL","value":20},{"name":"FYI","value":10}]';

这样，您可以使用layout.pie的值函数:

.value(function(d){return d.value;})

.text()函数可以这样使用:

.text(function(d){ return d.name; })

如果你仍然有不清楚的地方，也许你应该发布更多的代码，像函数arc和color

相关文章：