topic Re: SketchViewModel.pointSymbol support for PictureMarkerSymbol in ArcGIS JavaScript Maps SDK Questions

SketchViewModel.pointSymbol support for PictureMarkerSymbol

Alexander__Contractor_Schrimpf — Fri, 23 Aug 2019 16:59:03 GMT

I have a feature layer that uses PictureMarkerSymbols as the map markers. When I move the feature I can only get the SketchViewModel.pointSymbol to be either SimpleMarkerSymbol or PointSymbol3D as described in the api documentation here: https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Sketch-SketchViewModel.html

Is there a technical limitation for not being able to use PictureMarkerSymbols? Is there any way I could extend arcgis js api's current functionality to allow this?

Re: SketchViewModel.pointSymbol support for PictureMarkerSymbol

UndralBatsukh — Mon, 26 Aug 2019 18:02:17 GMT

Hi there,

You cannot change the update graphic for SketchViewModel at this time. It is on our to do list. However, I do not have a timeline for this.

-Undral

Re: SketchViewModel.pointSymbol support for PictureMarkerSymbol

Alexander__Contractor_Schrimpf — Mon, 26 Aug 2019 19:17:19 GMT

In case anyone else needs this functionality this hack somewhat works...

const editingLayer = new GraphicsLayer();

const map = new Map({

basemap: new Basemap({

baseLayers: [baseMapLayer]

}),

layers: [featureLayer, editingLayer]

});

const view = new MapView({

map,

container: this.$refs.map

});

const sketchViewModel = new SketchViewModel({

layer: editingLayer,

view,

updateOnGraphicClick: true

});

sketchViewModel.on("update", async event => {

if (event.state === "start") {

await Promise.all(

event.graphics.map(async (graphic: esri.Graphic) => {

const [PictureMarkerSymbol] = (await loadModules([

"esri/symbols/PictureMarkerSymbol"

])) as [esri.PictureMarkerSymbolConstructor];

graphic.symbol = new PictureMarkerSymbol({

url: require(`../assets/map_icons/${-1}_${

graphic.attributes.FCODE

}_solid_black.svg`),

height: 23,

width: 23

});

})

);

}

});

view.on("click", event => {

if (sketchViewModel.state === "active") {

return;

}

view.hitTest(event).then(({ results }) => {

results

.filter(x => x.graphic.layer === featureLayer)

.forEach(async result => {

editingLayer.add(result.graphic);

await sketchViewModel.update(result.graphic, {

tool: "move",

toggleToolOnClick: false

});