# Echarts 图层

<sm-web-map :map-options="mapOptions">
  <sm-echarts-layer :options="echartsOptions"></sm-echarts-layer>
</sm-web-map>
<script>
  $.get('../data/changchunBus.json', function(data) {
    var echartsOptions = {
      animation: false,
      GLMap: {
        roam: true,
      },
      coordinateSystem: 'GLMap',
      geo: {
        map: 'GLMap',
      },
      series: [
        {
          type: 'lines',
          polyline: true,
          data: data,
          silent: true,
          lineStyle: {
            normal: {
              opacity: 0.2,
              width: 1,
            },
          },
          progressiveThreshold: 500,
          progressive: 100,
        },
        {
          type: 'lines',
          coordinateSystem: 'GLMap',
          polyline: true,
          data: data,
          lineStyle: {
            normal: {
              width: 0.2,
            },
          },
          effect: {
            constantSpeed: 40,
            show: true,
            trailLength: 0.02,
            symbolSize: 2,
          },
        },
      ],
    };
    new Vue({
      el: '#main',
      data() {
        return {
          echartsOptions: echartsOptions,
          mapOptions: {
            container: 'map', // container id
            style: {
              version: 8,
              sources: {
                'raster-tiles': {
                  type: 'raster',
                  tiles: [
                      'https://iserver.supermap.io/iserver/services/map-china400/rest/maps/ChinaDark/zxyTileImage.png?z={z}&x={x}&y={y}',
                  ],
                  tileSize: 256,
                },
              },
              layers: [
                {
                  id: 'simple-tiles',
                  type: 'raster',
                  source: 'raster-tiles',
                  minzoom: 0,
                  maxzoom: 22,
                },
              ],
            },
            center: [125.35, 43.86],
            zoom: 10,
          },
        };
      },
    });
  });
</script>

# Attributes

参数 说明 类型 可选值 默认值
options 图层可选参数,参照 SuperMap echartsLayer API (opens new window) object - -
mapTarget 关联地图容器 ID。如果该参数省略,则默认绑定其父组件为地图组件的 Map 实例或者第一个地图组件的 Map 实例 string - -
最后更新时间: 2021/2/8 上午11:29:55