我正在尝试让d3缩放到边界框II示例(参见此处:https://bl.ocks.org/mbostock/raw/9656675/)在世界地图上工作,而不是按照示例中的美国州地图工作。不幸的是,缩放是不稳定的。对一些国家来说,它工作得很好;对另一些国家来说,它远远延伸到了太平洋。
如果我不能从远程位置加载topojson文件,我就会JSFiddle我的代码。我在上面示例中编辑的相关函数如下:
var projection = d3.geo.mercator() // instead of albersUsa
.scale(100)
.translate([width / 2, height / 2]);
d3.json("world-110m.json", function(error, world) { //world json
if (error) throw error;
g.selectAll("path")
.data(topojson.feature(world, world.objects.countries).features) //traverse world objects instead of state objects
.enter().append("path")
.attr("d", path)
.attr("class", "feature")
.on("click", clicked);
g.append("path")
.datum(topojson.mesh(world, world.objects.countries, function(a, b) { return a !== b; })) // append world objects not states
.attr("class", "mesh")
.attr("d", path);
});
感谢您的帮助。
注意:我刚刚意识到,对于某些状态,缩放也是不稳定的。例如,尝试单击VT或NH。我会在GitHub上提交一个bug。与此同时,有什么想法吗?
发布于 2016-05-11 20:53:43
我假设回答我自己的问题(即使我不是那个解决它的人)是合乎情理的。
scale = Math.max(1, Math.min(8, 0.9 / Math.max(dx / width, dy / height)))
https://stackoverflow.com/questions/37010345
复制相似问题