converting selected map service layer as graphics using esri js api

JayakumarPD — Mon, 18 Apr 2022 04:37:06 GMT

Hi, am I thinking in a right way, kindly guide.

Challenge: selecting a map service(polyline) by using click event and adding that selected map service(polyline) as graphics.

// defined a map map = new Map("map", { basemap: "topo-vector", center: [-146.87045, 63.227787], zoom: 7, logo: false, }); // added the layer var featureLayerSample = new FeatureLayer( "https://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StateCityHighway_USA/MapServer/0", { mode: esri.layers.FeatureLayer.MODE_ONDEMAND, outFields: ["*"], } ); map.addLayer(featureLayerSample); // on click function map.on("click", showRoadName); // function definition function showRoadName(evt) { console.log(evt); // here i am getting the information about the map service document.getElementById("distName").innerHTML = evt.graphic.attributes.ROUTE; // here i am getting the path array var mypaths = evt.graphic.geometry.paths[0]; var mypathsLenth = evt.graphic.geometry.paths[0].length; // simple custom symbology var symbol = new SimpleLineSymbol({color:[100, 200, 0], width:4}); // I passed the, array stright to new graphic. Thinking that, it will understand and add it as graphic, but failed map.graphics.add(new Graphic(mypaths, symbol)); } // second method, i created an object var myObject ={ paths:[], spatialReference:{"wkid": 102100} } // for the path pushed the array for(var i=0; i < mypathsLenth; i++){ console.log(mypaths[i]); myObject.paths.push("["+mypaths[i]+"]"); } // defined the polyline var singlePathPolyline = new Polyline(myObject); //trying to add, but still not able to add map.graphics.add(new Graphic(singlePathPolyline, symbol));

I am confused, do I am thinking properly to add. Or my way is wrong.

Or is there any simple way, where I can convert the selected map service as graphics. Pls help.

for first method, not giving any error, but for second --> polyline is not a constructor. error is coming.

Re: converting selected map service layer as graphics using esri js api

JayakumarPD — Tue, 19 Apr 2022 00:03:03 GMT

I understood, graphic is a high level geometry and I am passing low level geometry to it(i.e., paths).

Even I tried with

new Graphic(evt.graphic.toJson())

new Polyline( evt.graphic.geometry.toJson())

breakpoint shows the proper json construction, but Graphic and Polyline not able to understand this high level geometry. Can any body help.

Re: converting selected map service layer as graphics using esri js api

JayakumarPD — Tue, 19 Apr 2022 09:51:12 GMT

I realised, I was on a wrong way. This worked for me 🙂

let graphicJson = evt.graphic.geometry.toJson(); let highLevelGeometry = esri.geometry.fromJson(graphicJson); var symbol = new SimpleLineSymbol( SimpleLineSymbol.STYLE_DASH, new Color([0,0,250]), 3 ); map.graphics.add(new Graphic(highLevelGeometry, symbol));

topic Re: converting selected map service layer as graphics using esri js api in ArcGIS JavaScript Maps SDK Questions

converting selected map service layer as graphics using esri js api

Re: converting selected map service layer as graphics using esri js api

Re: converting selected map service layer as graphics using esri js api