Javascript d3.js矩形特征在Mollweide投影中绘制为圆弧
我试图在Mollweide投影下使用d3.js绘制一个矩形。但是，当我运行以下脚本时，矩形显示为圆弧或曲线矩形。我觉得巴哈维奥有点奇怪，因为莫维德投影中的平行线只是直线。有人能解释一下效果吗？同样的效果也存在于其他纬度和其他投影（甚至是等矩形投影）中 和生成的图形： 当我试图在不同纬度绘制几个相邻的矩形时，会出现更奇怪的结果：Javascript d3.js矩形特征在Mollweide投影中绘制为圆弧,javascript,d3.js,geospatial,Javascript,D3.js,Geospatial,我试图在Mollweide投影下使用d3.js绘制一个矩形。但是，当我运行以下脚本时，矩形显示为圆弧或曲线矩形。我觉得巴哈维奥有点奇怪，因为莫维德投影中的平行线只是直线。有人能解释一下效果吗？同样的效果也存在于其他纬度和其他投影（甚至是等矩形投影）中 和生成的图形： 当我试图在不同纬度绘制几个相邻的矩形时，会出现更奇怪的结果： D3路径沿着两个点之间最短的距离——大圆弧。这两个点位于椭球体上的三维空间中，因此它们之间的最短路径可能不对应于在投影二维空间中测量的它们之间的最短路径 举一个极端的例
D3路径沿着两个点之间最短的距离——大圆弧。这两个点位于椭球体上的三维空间中，因此它们之间的最短路径可能不对应于在投影二维空间中测量的它们之间的最短路径 举一个极端的例子，想象一个点位于北纬85度，西经90度，另一个点位于北纬85度，东经90度。尽管处于同一平行线上，但两者之间最短的距离是在北极上空短途旅行。D3会把这条线画成两条垂直线到地图的顶部（在一个典型的等长方形地图上：赤道位于中部，顶部在北），而不是沿着第八十五平行的水平线。
如果希望在投影平面上的两点之间有明显的直线，请将顶点投影到投影平面（svg坐标空间），然后绘制一条连接这些投影点的线。这可以通过创建一个新的geojson来实现，其中每个lat、长对的原始geojson都已被投影（
投影（[x，y]）.attr（d，d3.geoPath（null））<!DOCTYPE html>
<head>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="https://d3js.org/d3-geo-projection.v1.min.js"></script>
</head>
<body>
</body>
<script type="text/javascript">
var mainSVG = d3.select('body').append('svg').attr('width', 500).attr('height', 500);
var projection = d3.geoMollweide().scale(400).translate([250,750])
var path = d3.geoPath().projection(projection);
d3.json('test.json', function(error, vData) {
var features = vData.features;
mainSVG.selectAll('path')
.data(features)
.enter().append('path')
.attr('d', path)
.style('fill', 'red')
.style('stroke', 'black');
})
</script>
{
"type": "FeatureCollection",
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },
"features": [
{ "type": "Feature", "properties": { "DN": 0 }, "geometry": { "type": "Polygon", "coordinates": [ [ [ 7.6, 65.0 ], [ 60.4, 65.0 ], [ 60.4, 63.4 ], [ 7.6, 63.4 ], [ 7.6, 65.0 ] ] ] } }
]
}