echart地图有缝隙

刚学习了echarts热力图,在网上查找得中国地图,加载到echarts中,发现地图各个省之间链接处有很大的空隙(如图)

image.png
解决办法是,不能将数据直接复制过来使用,应在下载到本地。

下载地址:gitee.com/jcat/ecahrt…

下载后引入:
image.png
完美,国土不能分裂!!!

附上加载代码

      const option = {
        geo: {
          map: 'china', //这里的名称需要和china.js: echarts.registerMap('china',{})中的名称一致
          label: { show: true }, //显示省份
          roam: true //缩放
        },
        visualMap: {
          show: true,
          min: 1,
          max: 1000,
          inRange: {
            color: ['#d94e5d', '#eac736', '#50a3ba'].reverse()
          },
          textStyle: {
            color: '#fff'
          }
        },
        // 地图配置
        series: [
          {
            name: 'china',
            type: 'map',
            mapType: 'china',
            zoom: 1,
            geoIndex: 0,
            data: [
              { name: '北京', value: Math.random() * 1000 },
              { name: '天津', value: Math.random() * 1000 },
              { name: '上海', value: Math.random() * 1000 },
              { name: '重庆', value: Math.random() * 1000 },
              { name: '河北', value: Math.random() * 1000 },
              { name: '河南', value: Math.random() * 1000 },
              { name: '云南', value: Math.random() * 1000 },
              { name: '辽宁', value: Math.random() * 1000 },
              { name: '黑龙江', value: Math.random() * 1000 },
              { name: '湖南', value: Math.random() * 1000 },
              { name: '安徽', value: Math.random() * 1000 },
              { name: '山东', value: Math.random() * 1000 },
              { name: '新疆', value: Math.random() * 1000 },
              { name: '江苏', value: Math.random() * 1000 },
              { name: '浙江', value: Math.random() * 1000 },
              { name: '江西', value: Math.random() * 1000 },
              { name: '湖北', value: Math.random() * 1000 },
              { name: '广西', value: Math.random() * 1000 },
              { name: '甘肃', value: Math.random() * 1000 },
              { name: '山西', value: Math.random() * 1000 },
              { name: '内蒙古', value: Math.random() * 1000 },
              { name: '陕西', value: Math.random() * 1000 },
              { name: '吉林', value: Math.random() * 1000 },
              { name: '福建', value: Math.random() * 1000 },
              { name: '贵州', value: Math.random() * 1000 },
              { name: '广东', value: Math.random() * 1000 },
              { name: '青海', value: Math.random() * 1000 },
              { name: '西藏', value: Math.random() * 1000 },
              { name: '四川', value: Math.random() * 1000 },
              { name: '宁夏', value: Math.random() * 1000 },
              { name: '海南', value: Math.random() * 1000 },
              { name: '台湾', value: Math.random() * 1000 },
              { name: '香港', value: Math.random() * 1000 },
              { name: '澳门', value: Math.random() * 1000 }
            ]
          }
        ]
      };
      window.addEventListener('resize', function () {
        heatMapChart.resize(); //地图自适应
      });
      heatMapChart.setOption(option);
复制代码
© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享