move new graphic layer to a higher index (move up)

[CamCode]

I have created a simple polyline line graphic layer, i.e. below:

        const polyline = {

            type: "polyline",

            paths: [

                [lineY, lineX],

                [coordinatesBx, coordinatesBy]

            ]

        };

        const polylineGraphic = new Graphic({

            geometry: polyline,

            symbol: simpleLineSymbol,

            id: "drawLine"

        });

                graphicsLayer.add(polylineGraphic);

The problem is, it's going behind some elements... when it shouldn't be. It needs to be the second to top layer. For instance, I only want my modals to have a higher index then my new line here.

But if second to top is too low level; I could probably figure it out if I could simply know how make it the highest index (or on top of everything). I am having trouble toggling it's index position at all with the below two methods.

Most recently I have tried the below moveItem method. And did not see any effect... I have also tried the reorderLayer method, but anytime I use that I get 'reorderLayer' is not a function (perhaps because it is 3.x technique and I am on 4.x?).

          //Gets the item in the 0 index

          let drawLinegraphic = polylineGraphic.graphics.getItemAt(0);

          //moves it to the 5 index

          polylineGraphic.graphics.moveItem(drawLinegraphic, 5);

[AnneFitz]

Hi Cam,

If you are trying to move the graphicsLayer above the other layers within the map, you could try using the map.reorder(layer, index) method.

If you are just trying to move that specific graphic within your graphicsLayer, you could try using graphicsLayer.graphics.reorder(graphic, index).

Let me know if this works for you!

Thanks,

Anne

[CamCode]

Thanks so much for the response! Is there any demo to this usage? For some reason, no matter what I do, or which method I implement, I console log my line graphic's index via the below and it is always -1.

const drawlineLP = myAPP.mapview.map.layers.findIndex(layer => {
      return layer.id === 'drawLine';
});
console.log(drawlineLP);

[AnneFitz · Accepted solution]

If it's returning -1, that means that there is no match for the findIndex function.

Here's an example using a FeatureLayer and GraphicsLayer: https://codepen.io/annefitz/pen/ExVKzxV 

[CamCode]

Thank you so much for that! Very helpful!