Size of the webstyle symbol on the map

KarthikeyanShanmugam

Hello

 

I am using the tear-pin-2 from the webstyle symbol to be rendered on the map. Is there way attribute to change the size of the webstyle symbol which is present on the map.

 

          view.graphics.add({
            symbol: new WebStyleSymbol({
              name: marker.category.icon,
              styleName: "Esri2DPointSymbolsStyle",
            }),
            
            geometry: {
              type: "point",
              longitude: marker.lng,
              latitude: marker.lat
            },
            // content can be customised from the data got from the API
            popupTemplate: {
              title: "San Diego Zoo",
              content: "content string"
            }
          });

 

I would appreciate any suggestions to solve the problem.

Thank you

JoelBennett

You'll have to get the underlying CIMSymbol reference via fetchCIMSymbol, adjust its size, and use it directly.  For example, this doubles the size of the icon:

var symbol = new WebStyleSymbol({
	name: "tear-pin-2",
  	styleName: "Esri2DPointSymbolsStyle"
});

symbol.fetchCIMSymbol().then(function(cimSymbol) {
	cimSymbol.data.symbol.symbolLayers.forEach(function(symbolLayer) {
		symbolLayer.size = symbolLayer.size * 2;
	});

	view.graphics.add({
		symbol: cimSymbol,
		geometry: {/* etc */},
		popupTemplate: {/* etc */}
	});
});