MapGIS Client for JavaScript API

# new EchartsLayer(map, echartsOptions)

参数:

示例

混合开发模式

// ES5引入方式
const { WebTileLayer } = zondy.Layer
const { WebTileLayer, EchartsLayer, leaflet } = zondy
// ES6引入方式
import { WebTileLayer } from "@mapgis/webclient-common"
import { WebTileLayer, EchartsLayer } from "@mapgis/webclient-leaflet-plugin"
import * as leaflet from '@mapgis/leaflet'
// 请先确保引入了Echarts库
<script src="http://{ip}:{port}/echarts.min.js"></script>
// 构造一个WebTileLayer图层对象作为底图
const layer = new WebTileLayer({
  // 服务基地址
  url: 'http://t1.tianditu.com/DataServer?T=vec_c&x={col}&y={row}&l={level}'
});
// 加载图层元数据
layer.load().then(function () {
  // 构造地图视图的初始化参数
  const crs = initializeCRS(layer)
  const mapViewOptions = {
    // 地图视图参考系
    crs: crs,
    // 初始化中心点
    center: [31.147781205532336,112.21905099757561],
    // 初始化级数
    zoom: 6
  }
  // 构造Leaflet地图视图对象
  const map = L.map('地图视图容器ID', mapViewOptions)
  // 构造图层的初始化参数
  const layerOptions = initializeOptions(layer)
  // 添加图层到地图视图中
  const leafletLayer = new WebTileLayer(layer.url + '&tk=天地图token', layerOptions).addTo(map)
  // 构造Echarts数据和初始化参数
  const echartsOptions = {}
  // 创建并添加Echarts图层
  new EchartsLayer(map, echartsOptions).addTo(
    map
  );
})