Echarts加载自定义地图geoJson

Echarts3提供的地图有时无法满足我们的需求，这时可以引入geoJson作为底图。

准备你的geoJson文件，注意中括号的数量

"geometry": {
"type": "Polygon",
"coordinates": [
[
[-10.0, -10.0],
[10.0, -10.0],
[10.0, 10.0],
[-10.0, -10.0]
]
]
}

或者是

"geometry":
{
"type": "MultiPolygon",
"coordinates": [
[
[
[180.0, 40.0], [180.0, 50.0], [170.0, 50.0],
[170.0, 40.0], [180.0, 40.0]
]
],
[
[
[-170.0, 40.0], [-170.0, 50.0], [-180.0, 50.0],
[-180.0, 40.0], [-170.0, 40.0]
]
]
]
}

在echarts3中先注册再使用。

// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
$.get('myJson.json', function (myJson){
echarts.registerMap('MY', myJson) //注册
var option = {
series: [
{
name: 'my custom map',
type: 'map',
roam: true,
map: 'MY'
//使用
}
]
};
myChart.setOption(option);
}

echarts提供了例子但是很容易忽略这个链接
官方实例点我去看

最后

以上就是正直小蘑菇为你收集整理的Echarts加载自定义地图geoJson的全部内容，希望文章能够帮你解决Echarts加载自定义地图geoJson所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。