ArcGIS API：绘制圆固定中心

Question

我正在使用 ArcGIS API v4.8 和绘图工具在我的地图上绘制圆。

我注意到的 1 个问题是，当我画一个圆时，当我移动鼠标调整圆的大小时，圆的中心会移动，而不是固定在第一次鼠标单击开始时：

无论我如何移动圆的半径，如何固定圆心？我的代码中缺少什么？

  const options = {view, layer: tempGraphicsLayer, pointSymbol, polylineSymbol, polygonSymbol}
  let sketchViewModel = new SketchViewModel(options)

  let drawCircleButton = document.getElementById('circleButton')
  drawCircleButton.onclick = function () {
    clear()
    isDrawLine = false
    sketchViewModel.create('polygon', {mode: 'click'})
    sketchViewModel.create('circle')
  }

编辑：

我找到了一个类似的sample，选择画圆工具，开始在地图上画一个圆，你会发现当你移动鼠标的时候圆心也在移动，我想要它改为固定中心。

圆心随鼠标移动的问题是画的圆不准确，因为我想从我想要的圆心开始，圆可以向外扩展，但圆心不能移动.

Answer 1

这是因为圆 在给定的示例中 ，是在方形对象内部绘制的。基本上你的起点和终点代表角，而不是圆的中心点和外层。所以你每次展开圆形对象，它都是从一个角开始展开，而其余的是沿着你的鼠标拖动。

visual example

当然有解决方法。我制作了一个小示例代码，其中包含一种从固定中心点绘制圆的可能方法。

https://jsfiddle.net/wLd46g8k/9/

基本上我使用了一个名为 Circle 的 ArcGis JS API 4.x 构造函数，您可以在其中传递起点和半径。在我的示例中，我计算了这两点的半径。

function drawCircle(){//draws the circle
        graphicsLayer.graphics.removeAll();
        var graphic = new Graphic({
            geometry: new Circle({//circle constructor
            center: startPoint,//pass the pointer-down event X Y as a starting point
            radius: Math.floor(Math.sqrt(Math.pow(startPoint.x - endPoint.x, 2) + Math.pow(startPoint.y - endPoint.y, 2)))
          }), //calculates endpoint distance from the startpoint and pass it as a radius
          symbol: {//circle design
            type: "simple-fill",
            color: "orange",
            style: "solid",
            outline:{
                color:"darkorange",
              width:4
            }
          }
        });

        graphicsLayer.graphics.add(graphic);//adds the circle
      };

ArcGIS API：绘制圆固定中心

ArcGIS API: Drawing circle fixing center

arcgis-js-api