地图以矩形形式显示

时间:2020-05-04 13:26:42

标签: d3.js

为什么我的地图是矩形的?我使用了较旧的JSON文件,它正确地给了我输出,但是对于这个新的JSON文件,它给了我矩形的地图。 代码是相同的,只是提取状态名称和地区名称所做的微小更改,其余相同。

旧的Json文件输出: https://plnkr.co/edit/Z9A95awIrUCjPp9B

新的Json文件输出: https://plnkr.co/edit/UurfR1CtfekldUrr?open=lib%2Fscript.js&preview

它应该看起来像这样 https://github.com/ninjakx/Dc.-visualization-dashboard/blob/master/test_map.json

由于我的json文件太大,因此我只将一个分区发布在这里。我将显示整个印度地图。

所做的更改:

  india.selectAll("path")
    .data(json.features) 
    .enter().append("path")
    .attr("d", path)
    .style("fill", colors[0])
    .style("opacity", 0.5)

    .on('click', function (d, i) {
      d3.select(this).transition().duration(300).style("opacity", 1);
      div.transition().duration(300)
        .style("opacity", 1)
      div.text(d.properties.statename+ ':' + d.properties.distname) //<---- Here only
        .style("left", (d3.event.pageX) + "px")
        .style("top", (d3.event.pageY - 30) + "px");
    })

0 个答案:

没有答案