我使用两个json文件创建了一个欧洲地图.当用户双击某个国家/地区时,该国家/地区将进行缩放并显示其区域.
现在我希望当用户在一个国家/地区上空盘旋时,相应路径的边缘会改变颜色.这是一件非常容易的事.以下是执行此操作的代码段:
mapSvgGCountryPath.attr('class', 'country')
.attr('fill', 'black')
.style('stroke', 'white')
.style('stroke-width', 2)
.attr('d', path)
.attr('id', function(c) {
return 'country' + c.properties.nuts_id;
})
.on('click', clickOrDoubleCountry)
.on('mouseover', function(d) {
d3.select(this).style('stroke', 'red');
})
.on('mouseout', function(d) {
d3.select(this).style('stroke', 'white');
});
Run Code Online (Sandbox Code Playgroud)
问题是结果不起作用:
一些国家的边界被打破(似乎各国分享了一些中风).是由于json文件是如何制作的?在我之前的问题中,我解释了如何获取这些文件.
我怎么解决?