Supmap如何实现圆选查询数据—学习笔记

Supmap如何实现圆选查询数据

1.创建矢量图层DrawiCrcle和绘制要素类控件drawPolygonone(代码参考于SuperMap iServer)

var DrawiCrcle = new SuperMap.Layer.Vector("VectorLayer", { displayInLayerSwitcher: false });
var drawPolygonone = new SuperMap.Control.DrawFeature(DrawiCrcle, SuperMap.Handler.RegularPolygon, { handlerOptions: { sides: 50 } });
drawPolygon1.events.on({ "featureadded": drawCompletedtwo });//注册事件

2.点击按钮画圆(向地图添加图层和控件，激活控件)

 function drawCompletedtwo (drawBoundsArgs) {
            //注销控件
            drawPolygonone .deactivate();
            var feature = new SuperMap.Feature.Vector();
            feature.geometry = drawBoundsArgs.feature.geometry,
            DrawiCrcle.addFeatures(feature);
            var queryParam, queryByGeometryParameters, queryService;
            queryParam = new SuperMap.REST.FilterParameter({ name: "P15医疗服务_point@GuangZhouYueXiuDate#1" });
            queryByGeometryParameters = new SuperMap.REST.QueryByGeometryParameters({
                queryParams: [queryParam],
                geometry: drawBoundsArgs.feature.geometry,
            });
            queryService = new SuperMap.REST.QueryByGeometryService(url, {
                eventListeners: {
                    "processCompleted": ProcessCompleteds,
                    "processFailed": ProcessFailed
                }
            });
            queryService.processAsync(queryByGeometryParameters);
        }

3.画圆结束后调用该方法

function ProcessCompleteds(getFeaturesEventArgs) {
            var i, len, result = getFeaturesEventArgs.result;
            var i, j, result = getFeaturesEventArgs.result, marker;//queryEventArgs服务端返回的对象,返回值
            //recordsets查询结果记录集 将查询出来的地物按照图层进行划分，一个查询记录集存放一个图层的查询结果,即查询出的所有地物要素。
            if (result && result.recordsets) {
                for (i = 0, recordsets = result.recordsets, len = recordsets.length; i < len; i++) {
                    if (recordsets[i].features)//recordsets[i].features记录集中所有地物要素。
                    {
                        for (j = 0; j < recordsets[i].features.length; j++) {
                            var f = recordsets[i].features[j];
                            var point = f.geometry;//geometry该属性用于存放几何信息。
                            size = new SuperMap.Size(44, 33);//此类描绘一对高宽值的实例。
                            offset = new SuperMap.Pixel(-(size.w / 2), -size.h);//偏移量
                            //图标类，表示显示在屏幕上的图标，通常与 {SuperMap.Marker} 配合使用表示屏幕上显示的Marker。
                            //Icon具有url,size和position属性。也包含偏移量属性， 可以提供作为一个固定的偏移量，也可以函数计算得到期望的偏移量。
                            icon = new SuperMap.Icon("/SuperMap/theme/images/marker.png", size, offset);
                            //标记覆盖物，对地图上的点进行标注，可以自定义选择标注的图标，需添加到 Markers 图层上显示。
                            marker = new SuperMap.Marker(new SuperMap.LonLat(point.x, point.y), icon);//当前标记的位置,当前标记的图标。
                            marker.name = f.attributes.NAME;
                            marker.events.on({
                                "click": openInfoWin,
                                "touchstart": openInfoWin, //假如要在移动端的浏览器也实现点击弹框，则在注册touch类事件
                                "scope": marker
                            });
                            markerLayerone.addMarker(marker);
                            map.addLayer(markerLayerone);
                            map.setCenter(new SuperMap.LonLat(point.x, point.y), 2);
                            console.log(point.y)
                            closeInfoWin();
                        }
                    }
                }
            }
        }

4.方法执行失败调用该方法

function ProcessFailed(e) {
    alert(e.error.errorMsg);
 }

5.地图显示图标的点击事件

function openInfoWin() {
            //想清除地图显示的其他弹窗
            closeInfoWin();
            var marker = this;
            //console.log(marker);
            var lonlat = marker.getLonLat();
            var contentHTML = "<div style='font-size:.8em; opacity: 0.8; overflow-y:hidden;'>";
            contentHTML += "<div>" + marker.name + "</div></div>";
            var size = new SuperMap.Size(0, 33);
            var offset = new SuperMap.Pixel(0, -size.h);
            var icon = new SuperMap.Icon("/SuperMap/images/marker.png", size, offset);
            var popup = new SuperMap.Popup.FramedCloud("popwin",
                    new SuperMap.LonLat(lonlat.lon, lonlat.lat),
                    null,
                    contentHTML,
                    icon,
                    true);
            infowin = popup;
            map.addPopup(popup);
        }

6.关闭弹窗

var infowin = null;
function closeInfoWin() {
            if (infowin) {
                try {
                    infowin.hide();
                    infowin.destroy();
                }
                catch (e) { }
            }
        }

7.清除方法

function clearLayer() { 
            map.removeAllPopup();//移除所有弹窗
            drawPolygonone.deactivate();//注销控件
            DrawiCrcle.removeAllFeatures();
        }

8.代码运行效果图