Friday 15 May 2015

d3.js - d3 donut chart update with new csv dataset -



d3.js - d3 donut chart update with new csv dataset -

really struggling donut chart updated new info coming several csv files.

how can update chart new csv file? im using setinterval() circulate array of files.

my code:

var updatechart = function(){} var width = 360; var height = 360; var radius = math.min(width, height) / 2; var donutwidth = 75; var legendrectsize = 18; var legendspacing = 4; var color = d3.scale.category20b(); var svg = d3.select('#chart') .append('svg') .attr('width', width) .attr('height', height) .append('g') .attr('transform', 'translate(' + (width / 2) + ',' + (height / 2) + ')'); var arc = d3.svg.arc() .innerradius(radius - donutwidth) .outerradius(radius); var pie = d3.layout.pie() .value(function(d) { homecoming d.population; }) .sort(null); d3.csv('data.csv', function(error, dataset) { dataset.foreach(function(d) { d.population = +d.population; }); / var path = svg.selectall('path') .data(pie(dataset)) .enter() .append('path') .attr('d', arc) .attr('fill', function(d, i) { homecoming color(d.data.age); }); var legend = svg.selectall('.legend') .data(color.domain()) .enter() .append('g') .attr('class', 'legend') .attr('transform', function(d, i) { var height = legendrectsize + legendspacing; var offset = height * color.domain().length / 2; var horz = -2 * legendrectsize; var vert = * height - offset; homecoming 'translate(' + horz + ',' + vert + ')'; }); legend.append('rect') .attr('width', legendrectsize) .attr('height', legendrectsize) .style('fill', color) .style('stroke', color); legend.append('text') .attr('x', legendrectsize + legendspacing) .attr('y', legendrectsize - legendspacing) .text(function(d) { homecoming d; }); });

the csv format:

age,population cumulative,2704659 cumulative prev,4499890

thanks in advanced.

d3.js donut-chart

No comments:

Post a Comment