topic Re: Create and clone WebStyleSymbol --> Not a function in ArcGIS JavaScript Maps SDK Questions

Create and clone WebStyleSymbol --> Not a function

FriederHaag — Wed, 02 Mar 2022 09:30:18 GMT

Hi,

I am trying to create an instance of a WebStyleSymbol and then clone it to vary the height. However, I can't seem to find a way of doing so. When I try to autocast a symbol as WebStyleSymbol and then call it with e.g. fetchSymbol() or clone(), I get the "webStyleSymbol.clone is not a function" error. This leads me to believe that the casting itself somehow went wrong, even though the type is specified as "web-style".

I am not very proficient in Javascript or the ArcGIS API, so this might as well be some easy to avoid mistake Any help is appreciated. Find attached the minimum example to reproduce the error.

<html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no"> <title>Minimum working example</title> <style> html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%; } </style> <link rel="stylesheet" href="https://js.arcgis.com/4.22/esri/themes/light/main.css"> <script src="https://js.arcgis.com/4.22/"></script> <script> require([ "esri/config", "esri/symbols/WebStyleSymbol" ],(esriConfig, WebStyleSymbol)=> { //autocast new symbol let webStyleSymbol = { type: "web-style", styleName: "EsriInfrastructureStyle", name: "Wind_Turbine" }; console.log(webStyleSymbol.type); //check the type --> output "web-style" webStyleSymbol.clone(); //clone the symbol --> this throws an error console.log(webStyleSymbol.type); //check again }) </script> </head> <body> <div id="viewDiv"></div> </body> </html>

Re: Create and clone WebStyleSymbol --> Not a function

ReneRubalcava — Wed, 02 Mar 2022 15:31:04 GMT

That is not autocasting. Autocasting happens when you pass objects to constructors or methods that will autocast objects to instances of classes. If you create a new instance of the WebStyleSymbol, you can use the clone method and more.

https://developers.arcgis.com/javascript/latest/api-reference/esri-symbols-WebStyleSymbol.html#methods-summary

Re: Create and clone WebStyleSymbol --> Not a function

FriederHaag — Wed, 02 Mar 2022 16:04:26 GMT

Thank you! How would I autocast a WebStyleSymbol then? The example here seems to be using what I tried.

In any case you were right that it did not create a WebStyleSymbol properly. I used this and it worked:

let webStyleSymbol = new WebStyleSymbol({ styleName: "EsriInfrastructureStyle", name: "Wind_Turbine" });

Re: Create and clone WebStyleSymbol --> Not a function

ReneRubalcava — Wed, 02 Mar 2022 16:08:13 GMT

Glad you got it working!

In that example, the symbol object is added to the renderer of the layer. Under the hood, the renderer sees the object of the symbol passed to the setter, it will reactively create an instance of the symbol class based on the type property to the correct symbol instance. But the object has to be passed to something for that to happen.

Re: Create and clone WebStyleSymbol --> Not a function

FriederHaag — Wed, 02 Mar 2022 16:18:09 GMT

I see, thanks for the explanation!