Echarts加载自定义地图geoJson

来源:互联网 发布:移动刷流量软件 编辑:程序博客网 时间:2024/05/22 15:08

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提供了例子但是很容易忽略这个链接
官方实例点我去看