问题标签 [d3.geo]

I have a map that is zooming back and forth between a couple of locations. However, my map coordinates are off. It appears the map is centered at [0,0] by default. I changed projection.center to a new point, but this caused some chaos-- (the map started zooming to other continents...)

Here is a plunker with the map, with the 0,0 center (mouse over and you'll see the coordinates at the bottom).

I also tried setting projection.center within the zoomTo function, but that caused another problem. I feel like this should be a quick edit, but I've spent a lot of time pulling my hair out on this.

Any ideas on what needs to change?

Many thanks.

Code also below:

Screenshot, showing incorrect coordinates:

我想对 d3.geo 中的原点执行一个国家多边形的逆时针旋转。

例如，让我们将意大利绕 λ=0.5，φ=49.9 的点旋转 -7.2 度。首先，我们需要将这些欧拉角转换为仿射变换参数。在我们的例子中，参数将是：

当我使用带有此类参数的 QGIS 仿射变换插件时，生成的地图为.

当我projection.stream在 d3.js 中应用相同的参数时，结果非常不同（并且不正确）：https ://bl.ocks.org/memoryfull/946a8172d074a865c4ff

我在我的代码中正确处理了投影流，因为 (1, 0, 0, 0, 1, 0) 仿射变换会产生没有变换的预期结果。

预先感谢您的帮助。

有人可以向我解释以下情况吗？

假设我有一个 GeoJSON 文件，其中一个多边形特征只包含四个坐标：

现在我想把它投影到墨卡托并得到边界框：

结果不太直观。路径的边界框比任何投影点都大，地理边界框为[[-180,-90],[180,90]].

看起来多边形被解释为多边形之外的整个世界。这是预期的吗？为什么这样做而不是将多边形仅视为列出点内的区域？

Fiddle（打开调试器查看控制台日志）：

https://jsfiddle.net/pkerpedjiev/emr2g4f8/

我用 d3 创建了一个简单的世界地图，你可以在这里看到：http: //bl.ocks.org/wiesson/ef18dba71256d526eb42

有没有一种简单的方法可以将俄罗斯的一小部分（如图所示）向右移动，而无需创建新的 topojson？如果没有，还有其他想法吗？

我无法找出原因，因为它似乎在其他浏览器中工作正常，但是当放大到 14 或更高级别时，我在 Internet Explorer 11 和 Edge 中得到一个白页。

当我查看 DOM Inspector 时，就好像图块渲染在错误的位置（窗口外的某个地方）。即使对于演示也是如此，例如http://bl.ocks.org/mbostock/4132797。我正在尝试渲染矢量图块（类似于http://bl.ocks.org/mbostock/5593150），但遇到了同样的问题。在其他缩放级别上它工作得很好，所以它必须与它如何计算瓷砖的位置有关？

任何帮助/想法都会很棒。我还在 github 上发布了一个问题，因为它看起来可能是一个错误，但在那里似乎不是很活跃。

谢谢

我正在实现一个基本的交互式地图，其中一些数据放置在openstreetmap 图块的顶部。该代码与经典的 d3.geo.tile 示例非常相似：http: //bl.ocks.org/mbostock/5342063

除了一件事之外，一切似乎都工作得很好：在缩放和平移过程中瓷砖会闪烁。在原始示例和迄今为止我遇到的 d3.geo.tile 的所有其他用例中也观察到了这种效果。发生此 UX 错误是因为浏览器并不总是能够立即下载图块。令人惊讶的是，即使在加载某个图块之后，也不能保证它的重新出现是即时的——闪烁确实会不时地重新出现。

像 Leaflet 这样的滑动地图库尝试通过显示先前缩放级别的缓存切片来补偿闪烁，直到请求的切片准备好。在我看来，如果也可以为 d3.geo.tile 做类似的事情，那就太好了。

我尝试image.exit()使用这样的想法，即在加载新图块时，之前显示的图块可能会在屏幕上保留一段时间。但不幸的是，没有任何效果。

有人可以建议解决这个问题吗？不闪烁的平滑 D3 地图是 2016 年世界应得的！:–)

UPD

事实证明，使 tile url 不那么随机部分解决了问题（重新访问某个视图时发生的闪烁更少）：

演示

但是，这并不能从整体上解决问题。

我有一堆用州和县的人口普查 FIPS 代码编码的数据（即纽约是 FIPS 36，金斯县是 FIPS 36047）。我正在使用来自TopoJSON 文件的 d3.geo.albersUSA 投影映射该数据，该投影使用 FIPS 代码作为州和县特征的 ID。这非常适合合唱团，我只需要加入 ID。

但是，我想使用 path.centroid(feature) 和 LineString 路径类型从一个特征的质心到另一个特征绘制线。这是我的数据的简化示例：

我正在使用相同的数据在地图上绘制圆圈，使用 count_of_things 字段设置半径。这工作没问题。为了设置线条，我使用 FIPS 代码和特征质心创建了一个 map var，然后使用 FIPS 代码键从我的数据中提取起点。

我的代码是画线，但绝对不在质心点之间。我认为我不需要对点的投影做任何事情，因为它们来自已经为地图投影调整的特征，但也许我错了。这是我的代码：

我正在尝试在 React 组件中显示 D3 地理投影。

查看任何页面时，此错误发生在 D3 Geo 投影模块内：

对象不支持属性或方法“readFileSync”

它在模块的 index.js 中的这一行被抛出：

以下是添加到package.jsonas 依赖项的模块：

以下是我GeoMap使用 D3 地理投影插件的 React 组件的代码：

注意：点击任何页面时都会发生此错误，即使是那些不使用我的GeoMap组件的页面。

有谁知道为什么 D3 Geo Projection 插件找不到“fs”模块？

我有一张图像，我知道墨卡托投影的左下角和右上角坐标（纬度/经度）。

我将它添加到 Google Maps 中google.maps.GroundOverlay，这给了我正确的结果

我在图像的左上角（绿色）、右上角（红色）、右下角（青色）和左下角（红色）添加了一些颜色标记。

这一切都很好，除了我想使用 topojson 从 Google Maps 转移到 d3，因为 d3 更轻量级并且不需要 Google Map 的功能。

我创建了基于 d3 的地图，包括图像角落的标记，结果如下：

如果我覆盖两个窗口（包含 Google Maps 地图的浏览器和包含 d3 地图的浏览器），那么我可以让国家边界和角点非常精确地重叠。

这是一个动画 gif，它在 Google Maps 地图浏览器上具有 d3-map 浏览器，并且在工具的帮助下正在更改 d3-map 浏览器窗口的透明度。它从完全不透明变为完全透明，然后再次变为完全不透明。显示国家名称的图像是谷歌地图之一。

如您所见，这些点和国家边界对齐得非常好，但雷达图像却没有。将 d3 图像向下移动一点可以缓解问题，但不是正确的解决方案。我知道谷歌地图显示的是。

我在做什么：在 d3 地图中我正在创建投影

然后创建提供的图像 latlong 角的边界框。

并将它们从 latlong 空间投影到画布 x,y 坐标中。

当我画圆圈时，位置与谷歌地图上的位置非常精确。这意味着投影正在工作。

在画圆圈之前，我正在画topojson国家边界

问题来了：我以一种非常“便宜”的方式应用图像。我将左上角的 latlong 投影到画布 x,y 空间中，并将其用作svg:image. 这些点已经为上面的色环计算出来了，所以我在这里重新使用它们。

不知何故，我只是使用角落将图像固定在地图顶部，从而跳过了图像单个像素数据的投影变换。

我假设我应该将图像的每个 x,y 位置视为纬度/经度位置，然后通过墨卡托投影将每个像素投影到地图上。

但我不知道该怎么做。有任何想法吗？是否有类似于 d3.geo 的简单叠加插件google.maps.GroundOverlay？

我想知道如何使用 D3.js 为全屏世界地图计算和确定正确的 projection.scale([value]) 值。

文档说默认值为 150。但是这个“150”代表什么？

我正在尝试绘制与屏幕宽度完全相同的世界地图。我将 svg 区域设置为 window.innerWidth 但不确定我应该为世界地图的比例赋予什么值。

在某些情况下，人们得到了他们想要适应的特征的范围，但我无法得到世界地图整个范围的范围。

在这种情况下计算比例值的正确方法是什么？

提前致谢。