• arcgis api绘制多个点


    从网上找了好多教程,大多数都是实现点击一次按钮绘制一个点,无法实现一次性绘制多个点的功能。最后还是官方文档靠谱提供了现成的方法。

    首先需要定义一个按钮用于触发绘制事件

    <button id="btn_multipoint">绘制多个点</button>
    const btn_multipoint = document.getElementById("btn_multipoint");

    通过事件调用绘制方法

     btn_multipoint.addEventListener("click",function(){
            enableCreateMultipoint(drawTool,mapView);
          })

    需要创建绘图工具

     //创建绘图工具
          var drawTool = new Draw({
            view: mapView,
          });

    绘制点调用方法:

     // 绘制多个点
          function enableCreateMultipoint(drawTool) {
            let action = drawTool.create("multipoint");
    
            // Give a visual feedback to users as they move the pointer over the view
            action.on("cursor-update", function (evt) {
              createMultipointGraphic(evt.vertices);
            });
    
            // Fires when the user clicks, or presses the "F" key on the view
            // Can also fire when the "R" key is pressed to redo.
            action.on("vertex-add", function (evt) {
              createMultipointGraphic(evt.vertices);
            });
    
            // Fires when the "Z" key is pressed to undo the last added point
            action.on("vertex-remove", function (evt) {
              createMultipointGraphic(evt.vertices);
            });
    
            // Create a point when user clicks on the view or presses "C" key.
            action.on("draw-complete", function (evt) {
              createMultipointGraphic(evt.vertices);
            });
          }
    
          function createMultipointGraphic(vertices) {
            mapView.graphics.removeAll();
    
            let multipoint = new Multipoint({
              points: vertices,
              spatialReference: mapView.spatialReference,
            });
    
            const graphic = new Graphic({
              geometry: multipoint,
              symbol: {
                type: "simple-marker",
                style: "square",
                color: "red",
                size: "16px",
                outline: {
                  color: [255, 255, 0],
                   3,
                },
              },
            });
            mapView.graphics.add(graphic);
          }
    <button id="btn_multipoint">绘制多个点</button>
  • 相关阅读:
    二SERVLET(2)
    一SERVLET (1)
    eclipse 恢复SVN无法还原的文件 svn使用了还原,但本地的没有提交找回没提交代码的方法
    oracle dual 表
    sql 自增字段的控制 hibernate注解的写法
    sql 集合运算
    join
    group by having where order by
    数据库oracle 驱动版本
    JFreeChart的使用
  • 原文地址:https://www.cnblogs.com/1gaoyu/p/15204618.html
Copyright © 2020-2023  润新知