topojson - d3.js. How to make map full width? -
code available here. map looks full width, not @ all. there indents @ top , left , right sides. examples of d3.js maps use strange magic numbers in scale method. try use such numbers this answer, looks not true case. true way scale map? want make full width without indents on screen.
var body = d3.select("body").node().getboundingclientrect(); var coef = 640 / 360; var width = body.width; var height = width / coef; var svg = d3.select("body") .append("svg") .attr("width", width) .attr("height", height) var projection = d3.geo.equirectangular() .rotate([-180, 0]) .scale(width / 640 * 100) .translate([width / 2, height / 2]) var path = d3.geo.path() .projection(projection); d3.json("https://dl.dropboxusercontent.com/s/20g0rtglh9xawb8/world-50m.json?dl=1", function(error, world) { svg.append("path") .datum(topojson.feature(world, world.objects.land)) .attr("d", path); });
Comments
Post a Comment