首页 / 浏览问题 / 云GIS / 问题详情
js 绘制多边形出错
6EXP 2018年04月25日
VM71:1 Uncaught TypeError: Cannot read property 'events' of null
    at initialize.register (eval at <anonymous> (SuperMap-8.0.2-13626.js:3), <anonymous>:1:157249)
    at initialize.activate (eval at <anonymous> (SuperMap-8.0.2-13626.js:3), <anonymous>:1:156859)
    at initialize.activate (eval at <anonymous> (SuperMap-8.0.2-13626.js:3), <anonymous>:1:163058)
    at initialize.activate (eval at <anonymous> (SuperMap-8.0.2-13626.js:3), <anonymous>:1:198753)
    at draw_polygon (BasisTool.js:57)
    at HTMLButtonElement.onclick (SuperMapTest.html:39)

1个回答

您好,可以把全部代码给一下吗,我看一下哪里有问题
5,668EXP 2018年04月25日
pointLayer = new SuperMap.Layer.Vector("pointLayer");
drawPoint = new SuperMap.Control.DrawFeature(pointLayer, SuperMap.Handler.Point, { multi: true});

drawPoint.activate();//执行的这句的时候抱上面的错误
帮忙看看

您好,出现这个问题主要原因是代码拼写的问题,您可以检查一下有没有缺少的定义或者有符号少了这种错误,您可以检查一下,我把相似的HTML代码给您贴出来,这个是可以正确运行的,您根据这个看一下有没有拼写或定义变量的错误。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>点线面绘制</title>
    <style type="text/css">
        body{
            margin: 0;
            overflow: hidden;
            background: #fff;
        }
        #map{
            position: relative;
            height: 510px;
            border:1px solid #3473b7;
        }
        #toolbar {
        position: relative;
        padding-top: 5px;
        padding-bottom: 10px;
    }
    </style>
    <link href='./css/bootstrap.min.css' rel='stylesheet' />
    <link href='./css/bootstrap-responsive.min.css' rel='stylesheet' />
    <script src = '../libs/SuperMap.Include.js'></script>
    <script type="text/javascript">
        var map,layer,drawPoint, drawLine,drawPolygon,pointLayer,lineLayer,polygonLayer,
                host = document.location.toString().match(/file:\/\//) ? "http://localhost:8090" : 'http://' + document.location.host;
        url = host + "/iserver/services/map-world/rest/maps/World";
        function init()
        {
            //新建点矢量图层
            pointLayer = new SuperMap.Layer.Vector("pointLayer");
            snap01=new SuperMap.Snap([pointLayer],10,10,{actived:true});
            //矢量要素编辑控件
            modifyFeature=new SuperMap.Control.ModifyFeature(pointLayer);
            modifyFeature.snap=snap01;

            //新建线矢量图层
            lineLayer = new SuperMap.Layer.Vector("lineLayer");

            //新建面矢量图层
            polygonLayer = new SuperMap.Layer.Vector("polygonLayer");
            drawPoint = new SuperMap.Control.DrawFeature(pointLayer, SuperMap.Handler.Point, { multi: true});
            drawLine = new SuperMap.Control.DrawFeature(lineLayer, SuperMap.Handler.Path, { multi: true});
            drawPolygon = new SuperMap.Control.DrawFeature(polygonLayer, SuperMap.Handler.Polygon);

             switchSnap=document.getElementById("switchSnap");

            map = new SuperMap.Map("map",{controls:[
                new SuperMap.Control.Zoom() ,
                new SuperMap.Control.Navigation() ,
                new SuperMap.Control.LayerSwitcher()
            ,drawPoint,drawLine,drawPolygon]});
            layer= new SuperMap.Layer.TiledDynamicRESTLayer("World", url, null,{maxResolution:"auto"});
            layer.events.on({"layerInitialized":addLayer});


        }
        function addLayer(){

            map.addLayers([layer,pointLayer,lineLayer,polygonLayer]);
            //显示地图范围
            map.setCenter(new SuperMap.LonLat(0, 0), 0);
        }


         function edit_feature(){
            deactiveAll();
            modifyFeature.activate();
            snap01.on();
            snapState=true;
       }

        function deactivate_snap_all(){
            snapState=false;
            snap01.off();
        }
        function activate_snap_all(){
            snapState=true;
            snap01.on();
        }
        function switch_snap(){
            snapState?switchSnap.value="开启捕捉":switchSnap.value="关闭捕捉";
            snapState?deactivate_snap_all():activate_snap_all();
        }
        function deactiveAll(){
            modifyFeature.deactivate();
            deactivate_snap_all();
        }


        function draw_point(){
            deactiveAll();
            drawPoint.activate();

        }
        function draw_line(){
            deactiveAll();
            drawLine.activate();
        }

        function draw_polygon(){
            deactiveAll();
            drawPolygon.activate();
        }
        function deactiveAll(){
            drawPoint.deactivate();
            drawLine.deactivate();
            drawPolygon.deactivate();

        }
        function clearFeatures(){
            deactiveAll();
            pointLayer.removeAllFeatures();
            lineLayer.removeAllFeatures();
            polygonLayer.removeAllFeatures();
        }


    </script>
</head>
<body onload="init()" >
<div id="toolbar">
    <input type="button" class="btn" value="绘点" onclick="draw_point()" />
    <input type="button" class="btn" value="绘线" onclick="draw_line()" />
    <input type="button" class="btn" value="绘面" onclick="draw_polygon()" />
    <input type="button" class="btn" value="清除" onclick="clearFeatures()" />
    <input id="switchSnap" class="btn" type="button" value="开启点捕捉" onclick="edit_feature()" />
     <input id="switchSnap" class="btn" type="button" value="关闭捕捉" onclick="switch_snap()" />
</div>
<div id="map"></div>

</body>

这段代码也是根据iserver示范程序进行操作的,您对比一下检查看看有没有错误。因为您发的这两段代码没有错误,所以也没法判断。

跟我用的底图没关系吧  我用的wmts加载的wms服务图层
应该是没有关系的,这个问题之前我也遇到过,检查了一些类似编写问题这种代码基础之后就解决了,您先尝试仔细检查一下代码
谢谢 解决了  要把创建得工具加到map中
...