Show Bar Chart using d3.js -


hi using first time library 3d.js. doing basic example.

this data

  var dataset = {"6-12m_a": [{"count": 1231, "code": "272.4"}, {"count": 1115, "code": "v04.81"}, {"count": 1024, "code": "v70.0"}, {"count": 922, "code": "268.9"}, {"count": 818, "code": "780.79"}, {"count": 764, "code": "530.81"}, {"count": 693, "code": "v72.84"}, {"count": 652, "code": "v82.9"}, {"count": 650, "code": "278.00"}, {"count": 649, "code": "786.2"}],"6-12m_b": [{"count": 791, "code": "272.4"}, {"count": 734, "code": "250.00"}, {"count": 555, "code": "v70.0"}, {"count": 403, "code": "268.9"}, {"count": 395, "code": "244.9"}, {"count": 388, "code": "530.81"}, {"count": 336, "code": "780.79"}, {"count": 313, "code": "285.9"}, {"count": 292, "code": "278.00"}, {"count": 273, "code": "599.0"}],">12m_b": [{"count": 1252, "code": "v70.0"}, {"count": 1237, "code": "272.4"}, {"count": 1109, "code": "250.00"}, {"count": 731, "code": "v72.31"}, {"count": 633, "code": "v82.9"}, {"count": 594, "code": "268.9"}, {"count": 574, "code": "780.79"}, {"count": 570, "code": "599.0"}, {"count": 565, "code": "244.9"}, {"count": 548, "code": "724.2"}],">12m_a": [{"count": 3613, "code": "v70.0"}, {"count": 3480, "code": "401.1"}, {"count": 2915, "code": "v72.62"}, {"count": 2732, "code": "268.9"}, {"count": 2660, "code": "272.4"}, {"count": 2636, "code": "v72.84"}, {"count": 2383, "code": "v04.81"}, {"count": 2378, "code": "278.02"}, {"count": 2369, "code": "780.79"}, {"count": 2210, "code": "729.5"}],"0": [{"count": 8348, "code": "272.4"}, {"count": 6732, "code": "250.00"}, {"count": 3819, "code": "v70.0"}, {"count": 2728, "code": "278.00"}, {"count": 2412, "code": "v72.83"}, {"count": 2071, "code": "272.0"}, {"count": 1958, "code": "414.00"}, {"count": 1886, "code": "244.9"}, {"count": 1796, "code": "v82.9"}, {"count": 1703, "code": "530.81"}],"<6m_b": [{"count": 2001, "code": "250.00"}, {"count": 1818, "code": "272.4"}, {"count": 1455, "code": "v70.0"}, {"count": 935, "code": "268.9"}, {"count": 870, "code": "244.9"}, {"count": 820, "code": "278.00"}, {"count": 818, "code": "530.81"}, {"count": 743, "code": "780.79"}, {"count": 710, "code": "v82.9"}, {"count": 690, "code": "285.9"}],"<6m_a": [{"count": 2974, "code": "272.4"}, {"count": 1486, "code": "250.00"}, {"count": 1474, "code": "268.9"}, {"count": 1374, "code": "285.9"}, {"count": 1373, "code": "278.00"}, {"count": 1373, "code": "v72.84"}, {"count": 1218, "code": "530.81"}, {"count": 1204, "code": "v67.00"}, {"count": 1191, "code": "780.79"}, {"count": 1179, "code": "v70.0"}]} 

and code

  var tex_info = ["6-12m_a", "6-12m_b", ">12m_b", ">12m_a", "0", "<6m_b", "<6m_a"];   var w = 500;   var h = 200;   tex_info.foreach(function(item_list) {     dataset[item_list].foreach(function(item) {     d3.select("#chart2").selectall("div")       .data(item["count"])        .enter()       .append("div")       .attr("class", "bar")       .style({"height": function(d) {           var barheight = d*5;           return barheight + "px";       }, "width": "2%", "background-color":"blue","display":"inline-block", "margin-right": "0.5px", "margin-left": "0.5px"});     });   }); 

i want use each tex_info item represente x component in xasis each item of tex_info dictionary in dataset 10 values, want representing each values bars on each xasis, when try represent bar don't return nothing.

<div id="chart2"></div>  

i try same example using svg

 var svg = d3.select(".svg")             .append("svg")             .attr("width", w)             .attr("height", h);  d3.json("....", function(json) {   tex_info.foreach(function(list) {     json[list].foreach(function(item){       console.log(item);     svg.selectall("rect")        .data(item)        .enter()        .append("rect")        .attr("x", 0)        .attr("y", 0)        .attr("width", 20)        .attr("height", 100);     });   }); });     

any idea how solvent issue.

thanks in advance!


Comments

Popular posts from this blog

sql server - Cannot query correctly (MSSQL - PHP - JSON) -

php - trouble displaying mysqli database results in correct order -

C++ Linked List -