ArcGIS API：工程图圆固定中心

Question

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

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

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

  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，选择“绘制圆”工具，开始在地图上绘制一个圆，您会注意到在移动鼠标时圆的中心会移动，我希望它可以修复居中。

中心随鼠标移动而移动时的问题是绘制的圆不准确，因为我要从所需的圆的中心开始，圆可以向外扩展，但中心不应该移动。 / p>

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
      };