D3 V6和JavaScript - GeoJSON填充在路径外“溢出”。
使用D3 V6创建一个地图，显示县的教育程度。我有一个counties.topojson和csvData.csv，它们被加载：
var promises = [];
promises.push(d3.csv("data/csvData.csv")); //load attributes from csv
promises.push(d3.json("data/counties.topojson")); //load background spatial data
Promise.all(promises).then(callback);并在一个分配给变量csvData和counties的回调函数中。然后使用以下方法翻译counties：
miCounties = topojson.feature(counties, counties.objects.collection).features;csvData被连接到郡数据，连接在console.log(joinedCounties)中被确认，在回调函数setEnumerationUnits()中调用(其中colorScale是基于从csvData创建的数组的分位数规模，map是SVG元素：
function setEnumerationUnits(joinedCounties,map,path,colorScale){
var counties = map.selectAll(".counties")
.data(joinedCounties)
.enter()
.append("path")
.attr("class", function(d){
return "counties " + d.properties.NAME;
})
.attr("d", path)
.style("fill", function(d) {
return choropleth(d.properties, colorScale);
})我还应该提到在CSS中为.counties类添加“填充”也会创建“溢出”。我在QGIS和Pro中检查了topojson，这两者都是正常的。我还尝试了第二种数据来源，结果也是一样的。结果如下：
下面是在CSS中定义的没有样式、没有填充、只定义笔画的样子：
控制台中没有错误。我很感激任何人能给予的任何帮助！谢谢!
谢谢!turf.rewind成功了！！
下面是我为使其工作而添加的内容(安装了草皮库之后)：
miCounties.forEach(function(feature){
feature.geometry = turf.rewind(feature.geometry, {reverse:true});回答 1
Stack Overflow用户
发布于 2020-11-16 22:11:54
一个或多个GeoJSON条目是错误的。这些值是正确的，但它们的顺序是错误的。d3-geo一般期望GeoJSON特性按顺时针方向排列
球形多边形还需要一个缠绕顺序惯例来确定多边形的哪一边是内部的:小于一个半球的多边形的外部环必须是顺时针的，而大于一个半球的多边形的外部环必须是逆时针的。
您可以使用像turf这样的插件或工具修复数据的缠绕，您可以使用该插件或工具来“倒带”您的形状--尽管您应该使用reverse: true选项。
https://stackoverflow.com/questions/64866314
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号