javascript - d3.js map 插图(缩放)

标签 javascript d3.js maps

我正在尝试使用 d3.js 绘制 map ,该 map 具有城市 map 的一部分偏移并绘制在不同的位置( map 插图)。有使用 d3.js 的工作示例吗?如果没有,我是否可以使用不同的 .json 文件,创建一个 DOM 元素,正常加载主 map ,然后加载插图的辅助数据?

最好有一个工作示例会有所帮助,但如果什么都不存在,我会尝试根据我的理解进行编辑。

最佳答案

我正在研究类似的任务,但尚未完成。我最初的想法是定义一个像 albersUsa 描述的复合投影 here 。您可以从 implementation 看到它是如何工作的。 - 它基本上定义了 (lon,lat) => (x,y) 的三种不同投影,然后根据源点的经纬度选择要使用的投影。

但我不确定这对于插图是否可以开箱即用,因为不同的投影会重叠 - 例如,从某个遥远的地方到插图城市的道路会上升到未放大的边缘城市,然后在放大 View 的边缘重新开始。因此,您需要自定义剪切,以便基本投影在放大的插入边界(在屏幕坐标中)的边缘处被剪切,而不是在(经度,纬度)坐标中的插入边界的边缘处被剪切。实际上, map 上有一个区域未渲染,因为它被展开的插图隐藏了。

关于javascript - d3.js map 插图(缩放),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23329252/

相关文章:

javascript - 获取条形图中每个 y 轴的唯一最大值

Javascript:如何将动态键插入 map /对象?

javascript - 使用 leaflet-geosearch 添加搜索栏

JavaScript 单击停止开始时钟时间

javascript - Angular : adding conditional attributes to HTML

javascript - Plupload 弄乱了 jquery

javascript - 将文本值追加到 div onclick()

javascript - 在 sankey d3 javascript 文件中嵌入 json

node.js - 在node.js上删除d3图中的 Node

r - 最小尺寸测量的 K 均值算法变体