在地图上绘制纬度/经度-D3.js v4 [英] Plotting Lat/Long on map - D3.js v4

问题描述

我有一张简单的美国地图，我正在尝试绘制一些经纬度测试点.我发现此程序段解释了该过程，但在将语法转换为v4时遇到了麻烦.即使当我在块中运行确切的代码时，它也会引发相同的错误.

I have a simple map of the United States and I'm trying to plot some test Lat Long points. I found this block explaining the process but I'm having trouble converting the syntax to v4. Even when I run the exact code in the block it throws the same errors.

我可以看到d3.geoMercator()一种扁平化"地图.需要这个吗?看起来微不足道，但我喜欢没有此功能的美国地图的自然曲率.

I can see the d3.geoMercator() kind of 'flattens' the map. Is this needed? It seems trivial but I like the natural curvature the US map has without this.

好奇正确的方法是什么，以及是否有必要编写某些代码.特别是这部分:

Curious what the correct approach is, and if some of the code is even necessary. Particularly this part:

  projection //Added from block -- What is this doing?
    .scale(1000) //Added from block
    .center([-106, 37.5]) //Added from block

我的代码添加了错误的内容，我在添加的代码中添加了注释: https://jsfiddle.net/fettww66/2/

My code with the broken additions, I added comments to the code added: https://jsfiddle.net/fettww66/2/

推荐答案

在链接的bl.ock中，只需进行两项更改即可使其在D3 v4中运行:

In that bl.ock you linked, you only need two changes to make it running with D3 v4:

• var projection = d3.geo.mercator()↦var projection = d3.geoMercator()

var path = d3.geo.path()↦var path = d3.geoPath()

以下是使用D3 v4更新的bl.ocks: http://bl.ocks.org/匿名/d0b530924ef2aae3436840a1dbb3a39f

Here is the updated bl.ocks using D3 v4: http://bl.ocks.org/anonymous/d0b530924ef2aae3436840a1dbb3a39f

关于您的小提琴，问题很简单:您使用的是已经投影的JSON.只需将投影设置为null:

Regarding your fiddle, the issue is very simple: you are using an already projected JSON. Just set the projection to null:

.projection(null)

以下是更新的小提琴: https://jsfiddle.net/vypu9qwr/

Here is the updated fiddle: https://jsfiddle.net/vypu9qwr/

这篇关于在地图上绘制纬度/经度-D3.js v4的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！