Change marker symbol to pushpin

ITApplications

Hi all

Currently if a customer clicks on the map it drops a simple marker symbol (in red):

The code is:

 

I'd like to change the symbol to a pushpin and I've found the following on the ArcGIS API for Javascript site: 

https://developers.arcgis.com/javascript/latest/visualization/symbols-color-ramps/esri-web-style-symbols-3d/ 

The web reference behind the link is:

{"name":"Pushpin 2","type":"PointSymbol3D","symbolLayers":[{"type":"Icon","size":20,"anchor":"bottom","material":{"color":[232,157,0],"transparency":0},"resource":{"href":"https://static.arcgis.com/arcgis/styleItems/Icons/web/resource/Pushpin2.svg"}}]}

 I've tried putting this into my code:

But it's not working. Do I need to put the WebStyleSymbol syntax somewhere in my code or have I updated the current symbol code incorrectly?

Thanks in advance.

Ricky

JohnGrayson

...maybe try something like this:

view.on("click", function (evt) {
  if (view.scale <= 3500) {
    var graphic = new Graphic({
      geometry: {
        type: "point",
        x: evt.mapPoint.x,
        y: evt.mapPoint.y,
        spatialReference: view.spatialReference,
      },
      symbol: {
        type: "web-style",
        name: "push-pin-1",
        styleName: "Esri2DPointSymbolsStyle"
      } 
    });  
    view.graphics.removeAll();
    view.graphics.add(graphic);
  }
});