The plugin to integerate Echarts3 as a layer with maptalks.js
Clone or download
Latest commit 5cd5041 Nov 15, 2017
Permalink
Failed to load latest commit information.
demo update demo Oct 9, 2017
dist 0.4.5 Nov 15, 2017
test some updates Apr 25, 2017
.babelrc fixes for echarts 3.5.0+ Apr 30, 2017
.editorconfig initial commit Jan 20, 2017
.eslintrc some updates Apr 25, 2017
.gitignore some updates Apr 25, 2017
.npmignore update .npmignore Apr 25, 2017
LICENSE initial commit Jan 20, 2017
README.md fix url in readme Oct 11, 2017
circle.yml initial commit Jan 20, 2017
gulpfile.js update maptalks-build-helpers Sep 5, 2017
index.js rename variables Nov 15, 2017
karma.config.js add demos Jan 23, 2017
package.json 0.4.5 Nov 15, 2017

README.md

maptalks.e3

CircleCI NPM Version

A maptalks Layer to render with great echarts 3 library.

screenshot

Examples

Install

  • Install with npm: npm install maptalks.e3.
  • Download from dist directory.
  • Use unpkg CDN: https://unpkg.com/maptalks.e3/dist/maptalks.e3.min.js

Usage

As a plugin, maptalks.e3 must be loaded after maptalks.js in browsers.

<script type="text/javascript" src="https://unpkg.com/maptalks/dist/maptalks.min.js"></script>
<script type="text/javascript" src="https://unpkg.com/maptalks.e3/dist/maptalks.e3.min.js"></script>
<script>
// ecOptions is echarts' options
var e3Layer = new maptalks.E3Layer('e3', ecOptions)
    .addTo(map);
</script>

Supported Browsers

IE 9-11, Chrome, Firefox, other modern and mobile browsers.

API Reference

E3Layer is a subclass of maptalks.Layer and inherits all the methods of its parent.

Constructor

new maptalks.E3Layer(id, ecOptions, options)
  • id String layer id
  • ecOptions Object echarts options
  • options Object options
    • renderer String renderer of the layer, only 'dom' is supported now. ('dom' by default)
    • container String specify the container for layer dom elements: 'front' or 'back' ('front' by default)
    • hideOnZooming Boolean whether hide e3layer on zooming, to improve zooming performance.
    • hideOnMoving Boolean whether hide e3layer on moving, to improve moving performance.
    • hideOnRotating Boolean whether hide e3layer on drag rotating, to improve drag rotating performance.
    • Other options defined in maptalks.Layer

getEChartsOption()

get layer's echarts options

Returns Object

setEChartsOption(ecOptions)

set a new echarts option to the layer

  • ecOptions Object echarts options

Returns this

toJSON()

export the E3Layer's JSON.

var json = e3layer.toJSON();

Returns Object

Contributing

We welcome any kind of contributions including issue reportings, pull requests, documentation corrections, feature requests and any other helps.

Develop

The only source file is index.js.

It is written in ES6, transpiled by babel and tested with mocha and expect.js.

Scripts

  • Install dependencies
$ npm install
  • Watch source changes and generate runnable bundle repeatedly
$ gulp watch
  • Tests
$ npm test
  • Watch source changes and run tests repeatedly
$ gulp tdd
  • Package and generate minified bundles to dist directory
$ gulp minify
  • Lint
$ npm run lint