Question

<sm-web-map :map-options="mapOptions"></sm-web-map>
<script>
export default {
  data() {
      return {
        mapOptions: {
            container: 'map', // container id
            style: {
              "version": 8,
              "sources": {
                "raster-tiles": {
                  "type": "raster",
                  "tiles": [
                    'https://iserver.supermap.io/iserver/services/map-china400/rest/maps/China/zxyTileImage.png?z={z}&x={x}&y={y}'
                  ],
                  "tileSize": 256
                }
              },
              "layers": [{
                "id": "simple-tiles",
                "type": "raster",
                "source": "raster-tiles",
                "minzoom": 0,
                "maxzoom": 22
              }]
            },
            center: [120.143, 30.236], // starting position
            zoom: 3 // starting zoom
          }
      };
}
</script>

Answer 1

VUE开发可以参考iclient开发指南，以leaflet为例

https://iclient.supermap.io/web/introduction/leafletDevelop.html#Ready