d3.js - 在 d3.js 中绘制已经投影的 geoJSON map

标签 d3.js geojson

使用 d3.js 的 v3,我在使用 geoJSON 数据绘制 map 时遇到问题。代码和生成的 map 显示在:http://bl.ocks.org/73833ec90a8a77b0e29f .此示例使用 d3.js 的 v2 生成正确的 map 。

  • 我的数据已经投影(它们是荷兰国家网格/Rijksdriehoekstelsel 坐标)。为了弥补这一点,我编写了自己的投影函数,它只是将 map 的坐标系转换为像素(例如缩放和平移)。
  • d3.js v3 中的 d3.geo.path() 重新采样数据。但是,重采样中生成的点似乎与我的 map 不在同一个坐标系中(我假设它们是经纬度坐标)。

  • 我不想将我的 map 的坐标转换为 lon,lat 坐标,因为 map 已经按照我想要的方式投影了,据我所知,这不是一个微不足道的投影。

    如果问题确实是由重采样引起的,我想禁用重采样。但是,在文档中我真的找不到如何做到这一点。我可以传递一个流对象,而不是将投影函数传递给 d3.geo.path.projection()。我认为以下方法可行:
    var projection = d3.geo.projection(function(x, y) {
        return [ scale*(x-xmin), height-scale*(y-ymin) ];
      }).precision(0);
    

    但事实并非如此。可能也与我没有经纬度坐标有关。如何使用自定义投影功能禁用重采样?

    或者当其他原因导致问题时,我想听听。

    谢谢。

    最佳答案

    我最近遇到了同样的问题。

    这样做的方法是明确告诉 d3 您不想要投影。
    答案就在这个link .

    "If projection is null, the path uses the identity transformation, where the input 
    geometry is not projected and is instead rendered directly in raw coordinates. This can be 
    useful for fast rendering of already-projected geometry, or for fast rendering of the 
    equirectangular projection."
    

    所以你想拥有
    var path = d3.geo.path().projection(null);
    

    然后,像这样的事情
    g.selectAll("path")
                .data(json.features)
                .enter().append("path")
                .attr("d", path)
    

    关于d3.js - 在 d3.js 中绘制已经投影的 geoJSON map ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14646656/

    相关文章:

    javascript - D3 径向图的编程旋转

    javascript - 更改 c3 圆环图上的背景填充

    javascript - 将 D3 树节点位置绑定(bind)到 X 轴

    javascript - react-leaflet 太多标记导致页面卡住

    r - 将 geojson 转换为 sf 以获得 clotopleth map

    gis - Openlayers 3.5 和 GeoJSON

    javascript - 饼图布局起始 Angular

    javascript - D3.js 时间刻度怪异,值为 "11 PM"

    android - 无法解析符号 'GeoJsonLayer '

    javascript - 如何知道给定的 latlng 是否在 geojson 多边形坐标内