求使用D3制作图表课程源代码
请问这个课程有源代码吗?
请问这个课程有源代码吗?
2015-06-25
js:
3.csv("csv/data1.csv",type,function(data){
console.log(data)
var width = 400;
var height = 400;
//查找到最外层容器id=container的div中加入svg标签,并定义上宽和高
var svg = d3.select("#container7").append("svg").attr("width",width).attr("height",height);
var g = svg.append("g")
.attr("transform","translate("+200+","+200+")");
var arc_generator = d3.svg.arc()
.innerRadius(100)
.outerRadius(200);
// .startAngle(0)
// .endAngle(120*Math.PI/180);
var angle_data = d3.layout.pie()
.value(function(d){return d.population;});
console.log(angle_data(data));
var color = d3.scale.category10();
g.selectAll("path")
.data(angle_data(data))
.enter()
.append("path")
.attr("d",arc_generator).style("fill",function(d,i){return color(i)});
g.selectAll("text")
.data(angle_data(data))
.enter()
.append("text")
.text(function(d){return d.data.education})
.attr("transform",function(d){return "translate("+arc_generator.centroid(d)+")"})
.attr("text-anchor","middle")
.style("font-weight","bold");
});
function type(d){
d.population = +d.population;//这个样式可以将字符转成数值型
return d;
}举报