4.8 - How to draw a circle with a specific radius ?

2205
2
08-08-2018 05:02 AM
RobinChappatte
New Contributor III

I try to create a simple Circle, taking example on the polygon drawing sample code:

Code simplified for the example:
const action = draw.create('circle', {});

action.on('vertex-add', (evt) => this.createCircleGraphic(evt));
action.on('cursor-update', (evt) => this.createCircleGraphic(evt));
action.on('draw-complete', (evt) => this.createCircleGraphic(evt));

and

function createCircleGraphic(event) {
   mapView.graphics.removeAll();

   const circle = new Circle({
      spatialReference: mapView.spatialReference,
      center: event.vertices[0],
   });

   const graphic = new Graphic({
      geometry: circle,
      symbol: // my symbol,
   });

   mapView.graphics.add(graphic);
}

But at first the circle was not visible (even at the maximum zoom).

By looking at the devtools, I saw that the extent's dimensions was smaller than 0.001 px...

I could make the circles appear by specifying a radius of 10'000'000 meters, which make me think that something is working wrong...

With the devtools I could see that right after instanciating the circle object, it's spatialReference was wrong.

I can reset it right after, and then it become ok, but I dont know if this has any link with the issue...

Did I miss something ?

0 Kudos
2 Replies
RobinChappatte
New Contributor III

I just tried with different zoom and the visual size of the circle change as the scale of the view change, so it must be an issue with the radius only (and may be "fixed" by finding the good "meter radius --> buggy meter radius" ratio, waiting for the issue to be properly fixed).

0 Kudos
RobinChappatte
New Contributor III
const ARCGIS_CERLE_ISSUE_FIXER = 111500;
const circle = new Circle({
   spatialReference: mapView.spatialReference,
   center: event.vertices[0],
   radius: desiredRadius * ARCGIS_CERLE_ISSUE_FIXER,
});

is working fine enougth to me

0 Kudos