topic Re: Zoom to Extent of Graphics within several Graphics Layers in ArcGIS JavaScript Maps SDK Questions

Zoom to Extent of Graphics within several Graphics Layers

PaulMcCord — Fri, 02 Aug 2019 20:13:35 GMT

Is there a way to use the .goTo() method on an array of Graphics Layers so that I can zoom to the extent of the 'broadest' (most spread out) group of graphics? I'm creating an application where users are able to select from a list of park amenities. For each amenity that they select, a new Graphics Layer is created. I then add that Graphics Layer to an array of Graphics Layers. The problem arises when there are multiple layers in the array and I try to zoom to the extent of the amenities that are toggled on.

I've tried to simply add all of the Graphics from all of the Graphics Layers to a new Graphic Layer. However, when I do this, the Graphics are removed from the Graphic Layer from which they were copied. In other words, if I have a Graphic Layer for parks where basketball courts are located, when I try to "copy" these graphics into a separate Graphic Layer, they're removed from the initial basketball courts Graphic Layer.

Since I suspect that there is no way to run the .goTo() method on an array of Graphics Layers, I believe that the workaround is to add all of my Graphics to a new Graphic Layer, but this, surprisingly, doesn't seem to work. I've spent much more time on this issue than I thought I would; any help would be greatly appreciated!

Re: Zoom to Extent of Graphics within several Graphics Layers

RobertScheitlin__GISP — Fri, 02 Aug 2019 20:30:08 GMT

Paul,

Are you cloning the graphics before you add them to the new GL?

Re: Zoom to Extent of Graphics within several Graphics Layers

PaulMcCord — Sun, 12 Dec 2021 05:40:23 GMT

Hi Robert,

Yes, I'm cloning the graphics as they are added to the new GL:

function createExtentGraphic(amenityGraphicsLayer){
        for (g = amenityGraphicsLayer.graphics.length - 1; g>=0; g--){
          var graphicClone = new Graphic(amenityGraphicsLayer.graphics.items[g].clone());
          extentGraphics.add(graphicClone);
        }
      }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

This gives me the error: "[esri.core.Accessor] Accessor#set Invalid property value, value needs to be one of 'esri.geometry.Extent', 'esri.geometry.Multipoint', 'esri.geometry.Point', 'esri.geometry.Polyline', 'esri.geometry.Polygon', or a plain object that can autocast (having .type = 'extent', 'multipoint', 'point', 'polyline', 'polygon')"

This error seems pretty clear to me, but I'm not sure how to specify the type on the graphic before it is added to the graphic layer.

As you can see, my goal is to iterate through every graphic in the amenityGraphicsLayer GL and add it to the extentGraphics GL (which is a global variable).

Re: Zoom to Extent of Graphics within several Graphics Layers

BenElan — Sun, 12 Dec 2021 05:40:26 GMT

Try something like this:

function createExtentGraphic(amenityGraphicsLayer){
    const graphics = amenityGraphicsLayer.graphics;
    graphics.forEach(function (g) {
        var graphicClone = new Graphic();
        graphicClone = g.clone();
        extentGraphics.add(graphicClone);
        }
}‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Note I wrote this directly into the forum so there may be some syntax errors

Re: Zoom to Extent of Graphics within several Graphics Layers

PaulMcCord — Mon, 05 Aug 2019 18:35:15 GMT

Thanks Ben! This worked perfectly!