i trying follow choropleth example scott murray (shown in text book)using timezone geojson file. problem map ain't getting rendered , entire svg getting filled green color. code below, , know if i'm doing wrong in rendering map. fill colors in map using values under each timezone.(shown in picture below).
<script> var width = 1000; var height = 600; var d = []; var projection = d3.geo.mercator() .translate([width/2, height/2]) .scale([500]); var path = d3.geo.path().projection(projection); var color = d3.scale.ordinal().range(colorbrewer.ylgn[9]); var svg = d3.select("#viz").append("svg") .attr("width",width) .attr("height",height); d3.json('scm-timezone.json', function(data){ var com = data.commits; d.push(com); color.domain([ d3.min(d[0]), d3.max(d[0]) ]); d3.json("world.json", function(json){ for(var = 0;i < data.tz.length;i++){ var datatz = data.tz[i]; var commitvalue = parseint(data.commits[i]); for(var j = 0;j<json.features.length;j++){ var jsontz = json.features[j].properties.description; if(datatz == jsontz) { json.features[j].properties.value = commitvalue; } } } svg.selectall("path") .data(json.features) .enter() .insert("path") .attr("d",path) .style("fill", function(d) { var val = d.properties.value; if(val){ return color(val); } else { return "white"; } }); }); }); </script> and world.json looks this-
