首页 / 浏览问题 / 云GIS / 问题详情
selectGraphic控件的未选中事件
20EXP 2017年04月19日
js 8c的网络客户端,调试监听发现触发selectGraphic控件的onUnselect事件时传了一个参数,是对应graphicLayer的其中一个要素,但是这个要素没有规律,不知道是不是离鼠标事件位置最近的对象。操作是:事先并未选中要素,任点图层上的空白处。费解。贴上代码:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Graphic</title>
    <style type="text/css">
        body{
            margin: 0;
            overflow: hidden;
            background: #fff;
        }
        #map{
            position: relative;
            height: 500px;
            border:1px solid #3473b7;
        }
        #toolbar {
            position: relative;
            padding-top: 5px;
            padding-bottom: 10px;
        }
    </style>
  <script  type="text/javascript" src = 'http://support.supermap.com.cn:8090/iserver/iClient/forJavaScript/libs/SuperMap.Include.js'></script>
   
    <script type="text/javascript">
        var map,layer,graphicLayer,symbolinfo,vectorLayer,
                host = document.location.toString().match(/file:\/\//) ? "http://localhost:8090" : 'http://' + document.location.host;
        url =  "http://localhost:8090/iserver/services/map-China400/rest/maps/RailwayChina";
        function init()
        {
            if(!document.createElement("canvas").getContext){
         
                return;
            }
          map = new SuperMap.Map("map",{controls:[
            new SuperMap.Control.Navigation({
                dragPanOptions: {
                enableKinetic: true
            }
            })
            ]});
            layer = new SuperMap.Layer.TiledDynamicRESTLayer("World", url, null,{maxResolution:"auto"});
            layer.events.on({"layerInitialized":addLayer});
            vectorLayer = new SuperMap.Layer.Vector("vector");
            graphicLayer = new SuperMap.Layer.Graphics("Graphic Layer",null,{hitDetection:true});
        }
     function unselect(obj){
     var a = 1;
     alert(JSON.stringify(obj));
     }   

        function addLayer(){
            map.addLayers([layer,graphicLayer,vectorLayer]);
           
            map.setCenter(new SuperMap.LonLat(0, 0), 1);
           var selectfeature = new SuperMap.Control.SelectFeature(vectorLayer,{
                   onSelect : function(result,event){
                       alert('ttttt');
                   }
           });     
          var  selectGraphic = new SuperMap.Control.SelectGraphic(graphicLayer, {
onSelect: function(result,event){
alert(JSON.stringify(result));
},
onUnselect :unselect
});
map.addControl(selectfeature);
selectfeature.activate();
map.addControl(selectGraphic);
selectGraphic.activate();
        }

      
        var fillColors = ['rgba(255,153,0,0.4)', 'rgba(70,80,224,0.4)', 'rgba(60,150,79,0.4)', 'rgba(176,61,35,0.4)'];
        var strokeColors = ['rgba(255,204,0,0.2)', 'rgba(12,21,138,0.2)', 'rgba(20,99,32,0.2)', 'rgba(145,43,20,0.2)'];
        var radius = [3,6,9,12,15,18];
        var sybolCount = fillColors.length * radius.length * 2;
        var symbols = [];
        for(var i = 0; i <fillColors.length; i++){
            for(var j = 0; j<radius.length; j++){
                //circle  symbol
                symbols.push(new SuperMap.Style.Circle({
                            radius: radius[j],
                            fill: new SuperMap.Style.Fill({
                                color: fillColors[i]
                            }),
                            stroke: new SuperMap.Style.Stroke({
                                color: strokeColors[i]
                            })
                }));
                //star symbol
                symbols.push(new SuperMap.Style.RegularShape({
                    pointsLength: 5,
                    radius: radius[j],
                    radius1: radius[j]*0.6,
                    fill: new SuperMap.Style.Fill({
                        color: fillColors[i]
                    }),
                    stroke: new SuperMap.Style.Stroke({
                        color: strokeColors[i]
                    })
                }));
            }
        }

        var total,t1,t2;
        var e = 10000000;
        function addData()
        {
            graphicLayer.removeAllGraphics();
            vectorLayer.removeAllFeatures();
            var total = document.getElementById("total").value;
            t1 = new Date().getTime();
            var points2 = [];
            var points = [];
            var offlineStyle = {fillColor: "#898989",strokeColor: "#898989",pointRadius:"12px",cursor:"pointer"};
            for(var i = 0; i<total; i++){
                var point= new SuperMap.Geometry.Point(2 * e * Math.random() - e, 2 * e * Math.random() - e);
                var point2 = new SuperMap.Geometry.Point(3 * e * Math.random() - e, 3 * e * Math.random() - e);
                var pointVector = new SuperMap.Graphic(point);
                var pointvector2 = new SuperMap.Feature.Vector(point2);
                pointvector2.style = offlineStyle;
                pointVector.style={
                    image: symbols[i % sybolCount]
                };
                points.push(pointVector);
                points2.push(pointvector2);
            }
            graphicLayer.addGraphics(points);
vectorLayer.addFeatures(points2);
         
            t2 = new Date().getTime();
        
       
        }

      
        function removeData()
        {
            graphicLayer.removeAllGraphics();
            graphicLayer.refresh();
        }
    </script>
</head>
<body onload="init()" >
<div id="toolbar">
    <input id="total" type="text" style="width: 100px" value="1000">
    <input type="button" class="btn" style="margin-bottom: 10px" value="DRAW" onclick="addData()">
    <input type="button" class="btn" style="margin-bottom: 10px" value="REMOVE" onclick="removeData()">

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

</body>
</html>

捕捉到的事件对象obj打印:

{"id":"SuperMap.Graphic_3639","geometry":{"id":"SuperMap.Geometry.Point_3637","x":-2824257.0461351853,"y":5743943.61292712,"type":"NONE","bounds":{"left":-2824257.0461352,"bottom":5743943.6129271,"right":-2824257.0461352,"top":5743943.6129271}},"attributes":{},"style":{"image":{"radius":15,"fill":{"color":"rgba(60,150,79,0.4)"},"stroke":{"color":"rgba(20,99,32,0.2)"},"canvas":{},"anchor":[15.5,15.5],"size":[31,31]}}}

1个回答

我先放html里看看哈。
1,780EXP 2017年04月19日
SuperMap.Control.SelectGraphic 控件的clickout和onUnselect事件是BUG,我找研发处理下。
没有别的绕过这个缺陷的方法了,私信下我你的姓名、单位、手机号;缺陷解决后通知你。
...