利用arcgis api在分屏界面下绘制点、以及拉框选择

为了更加清晰的实现对比更能需要对其位置进行标注,所以我分别用点和矩形区域对界面进行了设置。

但是代码中也存在一个问题,因为图层是在map的基础上添加的,所以两个视图都使用了同一个地图即:

利用arcgis api在分屏界面下绘制点、以及拉框选择
const map = new Map({
                 basemap: "satellite",
             });

             const map2 = new Map({
                 basemap: "satellite",
             });
             
            //  let imageLayer = new MapImageLayer({
            //      url:''
            //  })
            //  Map.add(imageLayer);
             const view1 = new MapView({
                    container:"view1Div",
                    map: map,
                    center:[111.670801,40.818311],
                    snapToZoom: false,
                    zoom:10
             })

             const view2 = new MapView({
                    container:"view2Div",
                    map: map2,
                    center:[111.670801,40.818311],
                    zoom:10,
                    snapToZoom: false,
             })
View Code

首先是绘制点的情况

var graphicsLayer = new GraphicsLayer();


        // 点的样式
        var pointSymbol = {
        type: "simple-marker",
        style: "circle",
        size: 12,
        color: "blue"
    }
         view1.on("click", (event) => {
            
           //打印输出点击位置的坐标
            console.log(event.mapPoint.x);
            console.log(event.mapPoint.y);

            map.add(graphicsLayer);  
        var point = new Point({
            x: event.mapPoint.x,
            y: event.mapPoint.y,
            spatialReference: view1.spatialReference
        });
        var pointGraphic = new Graphic({
            geometry: point,
            symbol: pointSymbol
        });
                
        graphicsLayer.add(pointGraphic);    

矩形框的绘制:产生的效果就是,在左侧的地图界面进行点击,在界面进行拖动,在两个不同的界面相同位置产生两个矩形框。

const polygonGraphicsLayer = new GraphicsLayer();
        map.add(polygonGraphicsLayer);

        // create a new sketch view model set its layer
       
         const sketchViewModel = new SketchViewModel({
          view: view1,
          layer: polygonGraphicsLayer
        });

    sketchViewModel.create("rectangle");


上一篇:arcgis api之任务


下一篇:ArcGIS for Android入门程序之DrawTool2.0