首页 / 浏览问题 / 云GIS / 问题详情
leaflet不能高亮显示openlayers可以
snz
4EXP 2019年01月02日

使用产品:iserver 9d   操作系统:win10 x64

数据类型: 文件型

地图发布后直接在官方生成的代码基础上分别为lefalet及openlayers增加了ID查询方法,以下openlayers方式下增加如下查询方式后,地图可以高亮显示对应的ID点。

leaflet方式下居然不能高亮显示图层

// leaflet 方式下无法高亮显示查询结果图层
    <link href="https://cdn.bootcss.com/leaflet/1.3.1/leaflet.css" rel="stylesheet">
    <script type="text/javascript" src="https://cdn.bootcss.com/leaflet/1.3.1/leaflet.js"></script>
    <script type="text/javascript" src="http://iclient.supermap.io/dist/leaflet/iclient9-leaflet.js"></script>
    <script type="text/javascript">
        var map, layer, options,prjCoordSys,epsgcode,url = "http://localhost:8090/iserver/services/map-webgis/rest/maps/影像@map2";
        var dataurl = "http://localhost:8090/iserver/services/data-webgis/rest/data";
        var lon=0,lat=0,zoomlevel=2,initZoomToScale;
        function init() {
         	// 修改页面标题
        	var mapName = url;
            setPrjCoordSys(); // 初始化动态投影参数
            mapName = mapName.substring(mapName.lastIndexOf('/')+1);
            mapName =  decodeURI(mapName);
            document.title= mapName + "资源leaflet表述";

            loadMap();
        }

        function loadMap(getMapStatusEventArgs) {
			var originResult = {};
			var visableResolution = [];
			var mapcrs = L.CRS.EPSG3857;
			options = {};
			options.maxZoom = 18;
			options.minZoom = 0;

			if(originResult.prjCoordSys){
				if(epsgcode&&originResult.prjCoordSys.type!="PCS_NON_EARTH"){//有设置动态投影而且不是平面坐标的地图
					if(epsgcode=="4326"){
						options.projection = 4326;
						if(visableResolution.length > 0) {
							mapcrs = getCRS("EPSG:4326", originResult.bounds, visableResolution);
						} else {
							mapcrs = getCRS("EPSG:4326", originResult.bounds);
						}
					}else if(epsgcode=="3857"){
						options.projection = 3857;
						if(visableResolution.length > 0) {
							mapcrs = getCRS("EPSG:3857", originResult.bounds, visableResolution);
						} else {
							mapcrs = getCRS("EPSG:3857", originResult.bounds);
						}
					}
				} else {//没有设置动态投影
					if(originResult.prjCoordSys.epsgCode=="4326" || originResult.prjCoordSys.type=="PCS_EARTH_LONGITUDE_LATITUDE"){
						lon = (originResult.bounds.left + originResult.bounds.right) / 2;
						lat = (originResult.bounds.bottom + originResult.bounds.top) / 2;
						if(visableResolution.length > 0) {
							mapcrs = getCRS("EPSG:4326", originResult.bounds, visableResolution);
						} else {
							mapcrs = getCRS("EPSG:4326", originResult.bounds);
						}
					}else if(originResult.prjCoordSys.type=="PCS_NON_EARTH"){
						mapcrs = L.CRS.NonEarthCRS({
							bounds: L.bounds([originResult.bounds.left, originResult.bounds.bottom], [originResult.bounds.right, originResult.bounds.top]),
							origin: L.point(originResult.bounds.left, originResult.bounds.top)
						});
					}else {
						if(visableResolution.length > 0) {
							mapcrs = getCRS("EPSG:3857", originResult.bounds, visableResolution);
						} else {
							mapcrs = getCRS("EPSG:3857", originResult.bounds);
						}
					}
				}
			}
			
			var maxZoom = 18;
			if(visableResolution.length > 0) {
				maxZoom = visableResolution.length;
			}
			
			map = L.map('map', {
				//crs: L.CRS.EPSG3857
				center: mapcrs.unproject(L.point((originResult.bounds.left + originResult.bounds.right) / 2, (originResult.bounds.bottom + originResult.bounds.top) / 2 )),
		        maxZoom: 18,
		        zoom: 1,
				crs: mapcrs,
			});

			var layerUrl = url;
			layer = L.supermap.tiledMapLayer(layerUrl, options);
			layer.addTo(map);
			queryByID();
        }

        function queryByID() {
            var idsParam = new SuperMap.GetFeaturesByIDsParameters({
                IDs: [60, 61, 94],
                datasetNames: ["map:ZDG1_2"]
            });

            L.supermap
                .featureService(dataurl)
                .getFeaturesByIDs(idsParam, function (serviceResult) {
                    resultLayer = L.geoJSON(serviceResult.result.features, {
                        style: style,
                        onEachFeature: function (feature, layers) {
                            console.log("ID: " + feature.properties.SMID +"<br>" + feature.properties.NAME);
                            //console.log(feature.geometry);
                            layers.bindPopup("ID: " + feature.properties.SMID +"<br>" + feature.properties.NAME);
                        }
                    }).addTo(map);
                });
        }

		function getCRS(epsgCodeStr, bounds, resolutions) {
			return L.Proj.CRS(epsgCodeStr,{
				bounds: L.bounds([bounds.left, bounds.bottom], [bounds.right, bounds.top]),
				resolutions: resolutions,
				origin: [bounds.left, bounds.top]
			 });
		}

    </script>

用户官方生成的openlayers代码下增加query查询,得到的结果却可以高亮显示图层 

百思不得其解,官方生成的代码,只是增加了查询方法,但结果却怎么也显示不了,请各位帮忙看一看。

1个回答

你好,

首先您可以看一下返回的结果里面是不是有你查询到的feature,

然后你可以改变一下resultLayer的style的属性该下显示的样式,看是否能在地图上出现你查询出来的要素
3,357EXP 2019年01月02日
...