javascript - d3.js Two Dimensional Array Bar Chart -
javascript - d3.js Two Dimensional Array Bar Chart -
i trying create bar chart containing 3 'groups' of info in d3.js. have been able implement illustration "let's create bar chart" sample http://bost.ocks.org/mike/bar/2/, wondering how implement 2 dimensional info set instead.
i'm having bit of tough time wrapping head around sense should straight forwards process (select first index of 2d array -> iterate through array , display values of each element in bars -> select sec index of array -> iterate through array , display value of each element in bars etc...), examples hugely appreciated.
the code far is:
var info = [4, 8, 15, 16, 23, 42];*/ var width = math.max(500, innerwidth), height = math.max(500, innerheight), barheight = 80; var x = d3.scale.linear().domain([0, d3.max(data)]).range([0, width]); var chart = d3.select(".chart").attr("width", width).attr("height", barheight * data.length * 3); var bar = chart.selectall("g").data(data).enter().append("g").attr("transform", function(d, i) { homecoming "translate(0," + * barheight + ")"; }); bar.append("rect").attr("width", x).attr("height", barheight - 1); bar.append("text").attr("x", function(d) { homecoming x(d) - 3; }).attr("y", barheight / 2).attr("dy", ".35em").text(function(d) { homecoming d; });
however alter "data" variable be:
var info = [[40,45,5], [50,49,2], [60,62,4], [40,41,6], [42,40,3], [65,67,10], [70,67,17], [66,65,2], [45,44,3], [39,38,7], [38,38,8], [45,40,4], [43,35,3], [50,65,8], [51,50,6]];
javascript arrays svg d3.js charts
Comments
Post a Comment