I just learned echarts thermal map, found the Map of China on the Internet, loaded it into Echarts, and found a large gap between the links of each province on the map (as shown in the figure).

The solution is not to copy the data directly to use, should be downloaded to the local.

Download: gitee.com/jcat/ecahrt…

Download and introduce:Perfect, the land cannot be divided!!

Attach load code

Const option = {geo: {map: 'China ', // this name needs to be the same as the name in china.js: echarts.registermap (' China ',{}) label: {show: Levenshtein distance: true}, / / show provinces, visualMap: true / / zoom} {show: true, min: 1, Max: 1000, inRange: {color: [' # d94e5d ', '# eac736', '# 50 a3ba]. The reverse ()}, textStyle: {color:' # FFF '}}, / / map configuration series: [{name: 'China', type: 'map', map type: 'China ', zoom: 1, geoIndex: 0, data: [{name:' Beijing ', value: Math. Random () * 1000}, {name: Math. Random () * 1000}, {name: Math. Random () * 1000}, {name: Math. Random () * 1000}, {name: Math. Math. Random () * 1000}, {name: 'Math ', value: Math. Random () * 1000}, {name:' Math ', value: Math. Random () * 1000}, {name: 'Math. Random () * 1000}, {name:' Math. Random () * 1000}, value: Math.random() * 1000}, {name: 'Math ', value: Math. Random () * 1000}, {name:' Math ', value: Math. Random () * 1000}, {name: 'Math ', value: Math. Random () * 1000}, {name:' Math ', value: Math. Random () * 1000}, {name: 'Math ', value:' Math. Random () * 1000}, {name: 'Math. Math. Random () * 1000}, {name: 'Math ', value: Math. Random () * 1000}, {name:' Math ', value: Math. Random () * 1000}, {name: 'Math. Random () * 1000}, {name:' Math. Random () * 1000}, {name: 'Math. Math. Random () * 1000}, {name: 'gansu ', value: Math. Random () * 1000}, {name:' Gansu ', value: Math. Random () * 1000}, {name: 'Math. Random () * 1000}, {name:' Math. Random () * 1000}, value: Math. Random () * 1000}, {name: 'Math ', value: Math. Random () * 1000}, {name:' Math ', value: Math. Random () * 1000}, {name: 'Math. Random () * 1000}, {name:' Math. Math. Random () * 1000}, {name: 'Math ', value: Math. Random () * 1000}, {name:' Math ', value: Math. Random () * 1000}, {name: 'Math. Random () * 1000}, {name:' Math. Random () * 1000}, value: Math.random() * 1000}, {name: 'Math ', value: Math. Random () * 1000}, {name:' Taiwan ', value: Math.random() * 1000}, {name: 'Hong Kong ', value: math.random () * 1000}, {name:' Macau ', value: Math.random() * 1000 } ] } ] }; window.addEventListener('resize', function () { heatMapChart.resize(); // map adaptive}); heatMapChart.setOption(option);Copy the code