Giter VIP home page Giter VIP logo

leaflet-echarts's Introduction

leaflet-echarts

A plugin for leaflet to load echarts map and make BigData Visualization.

基于leaflet 扩展echarts,使ECharts的地图可以加到leaflet上

根据百度地图echarts的扩展改写,在事件联动这个地方以及echarts的容器与地图容器在拖动和缩放中的适应上耗费了很长时间,为了兼容echarts的map其他类型的数据又下了不少功夫。现在可以算是一个稍微完美的版本了。好的效果请在谷歌浏览器访问。

This is a beta version,so it would have some bugs,visit it by chrome will be better. When you want to drag the map,drag on zhe basemap without echarts data. It seems that i have solved this problem.

使用方法(Usage)

  1. Confirm you have import leaflet first, 引入leaflet的js和css库自然不用说

  2. Import eaflet-echarts.js ,可以通过npm安装,输入npm install leaflet-echarts 即可

  3. Import echarts.source.js under directory lib 引入lib目录下的echarts.source.js文件

  4. As you can use this plugin like this,按照下面的方法使用

    	var overlay = new L.echartsLayer(map, echarts);
    	var chartsContainer=overlay.getEchartsContainer();
    	var myChart=overlay.initECharts(chartsContainer);
    	var option={};//这里跟百度echarts的map的option一样,the option is same as echarts map
    	overlay.setOption(option);
    
  5. If you don't konw how to use this plugin,hava a look at /examples/index.html,如果你不会用,看看examples目录下的index.html

截图示例

参考

https://github.com/ecomfe/echarts

leaflet-echarts's People

Contributors

wandergis avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.