https://github.com/lzxue/echartsLayer

mapboxGL echartLayer
https://github.com/lzxue/echartsLayer

Last synced: about 1 month ago
JSON representation

mapboxGL echartLayer

• Host: GitHub
• URL: https://github.com/lzxue/echartsLayer
• Owner: lzxue
• License: mit
• Created: 2016-12-29T04:27:47.000Z (almost 8 years ago)
• Default Branch: master
• Last Pushed: 2020-09-16T06:36:10.000Z (about 4 years ago)
• Last Synced: 2024-10-28T16:20:46.806Z (about 2 months ago)
• Language: JavaScript
• Size: 27.6 MB
• Stars: 167
• Watchers: 4
• Forks: 91
• Open Issues: 11
• Metadata Files:
  • Readme: readme.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-echarts - MapBoxGL-echarts3-layer - Apache ECharts MapBoxGL 扩展，可以从二，三维视角展示空间点，线，面，数据. (Extensions / Videos)

README

        
## mapboxGL echartslayer

Add [echarts](https://github.com/ecomfe/echarts) charts to  [mapboxGL](https://github.com/mapbox/mapbox-gl-js) as a layer

In order to use this plugin, include the echartsjs andEchartsLayer.js  on your page and use it as follow:

### demo

[全球航线](https://lzxue.github.io/echartsLayer/demo/lines-airline.html)

[全国空气质量](https://lzxue.github.io/echartsLayer/demo/effectScatter-map.html)

[模拟迁徙](https://lzxue.github.io/echartsLayer/demo/geo-line.html)

[微博签到](https://lzxue.github.io/echartsLayer/demo/scatter-weibo.html)

### import

```html

    

    

```

### with webpack

```js

npm install echartslayer

```

```js

require('echarts');

var EchartLayer=require('echartslayer');

var echartslayer = new EchartsLayer(map);

echartslayer.chart.setOption(option);

//移除 

echartslayer.remove();

```

### Usage

set the charts attribute coordinateSystem:"GLMap"

```js

option = { 

  GLMap: { //Must

  },

  series: [{

    coordinateSystem: 'GLMap',

  }]

}

```