Javascript 缩放D3.js后的地质路径重叠

我的代码是

var width = d3.round($('.map-container').width());
var height =d3.round($(window).height()); 
var svg = d3.select("#india")
            .append("svg")
            .attr("width", width)
            .attr("height", height);
//using geojson file mentioned above just name and extension changed
d3.json("/Scripts/in-states.js", function (json) {
    var center = d3.geo.centroid(json)
    var scale = 1000;
    var offset = [width / 2, height / 2];
    var projection = d3.geo.mercator()
                           .scale(scale)
                           .center(center)
                           .translate(offset);


    var path = d3.geo.path().projection(projection);

      svg.selectAll("path")
                .data(json.features)
                .enter()
                .append("path")
                .attr("class", function (d) {
                    return "state " + d.properties.name;
                })
                .attr("stroke-width", "0.2em")
                .attr("fill",'#045A8D')
                .attr("d", path);
    });

现在，当它被渲染时，name='Lakshadweep'覆盖整个地图的功能

!

我不知道为什么会这样？因为上述geojson的工作原理与gist中的预期一致。

---

在这种情况下，路径（状态）的顺序重要吗？（我对svg和d3有点陌生）

看起来这条特定的路径可能被颠倒了。您可以尝试将其加载到GIS程序（如）中，然后再次导出为GeoJSON以进行规范化。

看起来该特定路径可能会反转。您可以尝试将其加载到GIS程序中，然后再次导出为GeoJSON以进行规范化。@Larskothoff谢谢您的提示。已解决。太好了，我将添加此作为参考答案。我没有阅读以下重要说明：多边形的内部是多边形按顺时针顺序缠绕的所有点。如果GeoJSON输入的多边形缠绕顺序错误，则必须反转它们，例如通过ST_ForceRHR；您还可以将GeoJSON转换为TopoJSON，这将自动发生。