Community
Select to view content in your preferred language

[esri.core.Accessor] Accessor#set Assigning an instance of 'esri.geometry.SpatialReference' which is not a subclass of 'esri.geometry.SpatialReference

2011
4
04-11-2022 02:44 AM
YogeshSwami
by
Emerging Contributor
‎04-11-2022 02:44 AM

I am trying to implement a drag and drop functionality for a polygon sketch and getting this error while doing so:

 [esri.core.Accessor] Accessor#set Assigning an instance of 'esri.geometry.SpatialReference' which is not a subclass of 'esri.geometry.SpatialReference'

I am able to achieve the functionality but my console gets flooded with this error.

Here is what i wrote about spatial reference:

         const footMap2 = new Map({
            basemap: "satellite", // Basemap layer service
            layers: [graphicsLayer]
        });
        const view2 = new MapView({
            map: footMap2,
            center: [long,lat]
            zoom: 20,
            container: footMap2container, // Div element
        });
 
       
        view2.when(() => {
            addGraphics();
            const obj: any = {
                view: view2,
                layer: graphicsLayer,
                updateOnGraphicClick: false,
                snappingOptions: { 
                    enabled: true,
                    featureSources: [{ layer: graphicsLayer, enabled: true }]
                }
            }
            const sketch: any = new Sketch(obj)
 
            sketch.on("update", (event: any) => {
                if (event.state === "complete") {
                    const updatedLatLng: any = [];
                    const xyPoints = event.graphics[0].geometry.rings[0];
                    xyPoints.forEach((point: any) => {
                        const result = webMercatorUtils.xyToLngLat(point[0], point[1]);
                        updatedLatLng.push(result);
                    });
                }
            });
        });

        // Add new development polygon graphic and boundary polygon graphics
        const addGraphics = () => {
            const vertices: any = [];
            const latlngvertices = this.updateLatLong(this.footPrintData.footprint_data);
            latlngvertices.forEach((point: any) => {
                const result = webMercatorUtils.lngLatToXY(point[0], point[1]);
                vertices.push(result);
            });
            const polygon: any = {
                type: "polygon",
                rings: vertices,
                spatialReference: view2.spatialReference
            };

            const validSymbol: any = {
                type: "simple-fill",
                style: "solid",
                color: "#4472c4",
                outline: {
                    color: "white",
                    width: 2
                }
            };=
            const newDevelopmentGraphic = new Graphic({
                geometry: polygon,
                symbol: validSymbol
            });
            graphicsLayer.addMany([newDevelopmentGraphic]);
        }
    }
 
and after running this, i am getting this error when I hover over map outside the polygon:
YogeshSwami_0-1649699781875.png

 

 
Can someone please help?
 
0 Kudos
4 Replies
ReneRubalcava
by
Honored Contributor
‎04-11-2022 07:33 AM

Sample application please. 

0 Kudos
ReneRubalcava
by
Honored Contributor
‎04-11-2022 10:39 AM

I should note, this can happen if you are using two different versions of the API for some reason, or mixing npm with the CDN. This can also happen in some monorepo use cases as well.

YogeshSwami
by
Emerging Contributor
‎04-11-2022 11:00 AM

Hello,

I have updated the question by including more sample code. Please check it once and see if there is a solution for resolving this error.

Thanks in advance.

 

0 Kudos
bogind
by
Occasional Contributor
‎05-04-2023 10:15 PM

This is a bit silly, but from your code it looks like you need to replace the way you defined your  polygon geometry from this:

const polygon: any = {
                type: "polygon",
                rings: vertices,
                spatialReference: view2.spatialReference
            };

 

to this:

const polygon: any = {
                type: "polygon",
                rings: vertices,
                spatialReference: {wkid:3857} // for example, it can be another CRS that you want to use
            };

 

 

It seems that the API handles casting the object better than getting a SpatialRefernce object

https://developers.arcgis.com/javascript/latest/api-reference/esri-geometry-Geometry.html#spatialRef...

0 Kudos