Question

在vue3.0中引入leaflet.draw

使用L.supermap.featureService查询数据，返回的结果是MultiPolygon形式的，L.geoJSON无法直接解析。

将MultiPolygon转成坐标点数组，直接创建L.Polygon时提示Cannot read property 'Poly' of undefined

数据如下：
链接：https://pan.baidu.com/s/1gRnBFZi-GVcMe5LoF3OSCQ
提取码：tjqw

Answer 1

您好，方便的话请提供更多信息，比如贴一个.vue单文件组件作为demo，看下代码呢。

Comments

 测试代码如下，leaflet.draw.css文件在main.js里引入的。

<template>
	<div id="map"></div>
</template>

<script>
import L from 'leaflet';
import proj4 from 'proj4';
import '@supermap/iclient-leaflet';
import 'leaflet-draw';
import axios from 'axios'

export default {
  name: 'MyMap1',
  props: {},
  mounted(){
	var _this = this;

	//#region 加载iServer图层
	var urls=[{alias:"总规",url:"http://192.168.2.101:8090/iserver/services/map-ws8/rest/maps/ZG"}];
	//自定义坐标系（大地2000）
	proj4.defs("EPSG:4549","+proj=tmerc +lat_0=0 +lon_0=120 +k=1 +x_0=500000 +y_0=0 +ellps=GRS80 +units=m +no_defs");
	//leaflet CRS投影设置
	var crs = L.Proj.CRS("EPSG:4549", {
		bounds: L.bounds([541921.21, 4235403.46],[583538.58, 4264501.04]),
		origin: [562729.9, 4249952.25]
	});
	var map = L.map('map', {
		crs: crs,
		center: [4249778.73, 562703.98],
		maxZoom: 18,
		zoom: 1,
		//drawControl: true,
	});
	//添加图层
	for(var i =0;i<urls.length;i++){
		var lyr = L.supermap.tiledMapLayer(urls[i].url, {
			transparent: true,
			noWrap: true
		}).addTo(map);
	}
	//获取地图的范围，并将地图缩放到此范围
	mapService();
    function mapService() {
		//获取图层信息（这里是获取第一个图层，然后将地图缩放到该图层的范围）
        L.supermap.mapService(urls[0].url).getMapInfo(function (serviceResult) {
            var result = serviceResult.result;
			//自动将地图缩放到一个指定的范围
			map.fitBounds([
				[result.bounds.bottom,result.bounds.left],
				[result.bounds.top,result.bounds.right]
			])
			//加载测试polygon的JSON数据
			axios.get('geojson.json').then((data)=>{
				L.polygon(data.data).addTo(map);
			});
        });
    }
	//#endregion
  },
}
</script>

<style scoped>
  #map {
    margin: 0;
	text-align: left;
    overflow: hidden;
    background: #fff;
    width: 100%;
    height:100%;
    position: absolute;
  }
</style>

---

有人解决吗

---

有的，这边测一下给您回复。

---

把引用的leaflet-draw去掉，使用L.polygon成功了。