On our map, we have a crosshair symbol for the current location. There is an Edit button that, when clicked, will allow the user to click anywhere within that crosshair and drag that crosshair to another location (without moving the map). It works fine in 4.13, but not in 4.14.
When the Edit button is clicked, a function is called to update the SketchViewModel with the crosshair symbol and set tool to 'move'. It then creates a listener that calls a function to perform the desired actions upon update (coded in TypeScript):
private startUpdate() {
this.isEditing = true;
this.editGraphic.symbol = this.featureEditSymbol;
this.sketchViewModel.update([this.editGraphic], {
tool: 'move',
});
// This commented code works in 4.13. I needed to add the .bind(this)
// to get it to compile in 4.14.
//this.editGraphicUpdateListener = this.sketchViewModel.on('update', this.onEditGraphicMove);
this.editGraphicUpdateListener = this.sketchViewModel.on('update', this.onEditGraphicMove.bind(this));
}
// This is to re-center the map on the current position of the location marker as it is dropped.
onEditGraphicMove(event: __esri.UpdateToolEventInfo) {
if (event['state'] === 'active' && event.propertyIsEnumerable('toolEventInfo')) {
const toolEventInfo = event['toolEventInfo'];
if (toolEventInfo.propertyIsEnumerable('type')) {
if (toolEventInfo.type === 'move-stop') {
this.editGraphicPoint = new Point(toolEventInfo.mover.geometry);
this['view'].center = this.editGraphicPoint;
}
}
}
}
The 4.13 version did not immediately fire that event to call onEditGraphicMove(), but the 4.14 version fires the event right after the listener is registered. When that occurs, the event state is 'update'.
So, after I click the Edit button, if I hover over the crosshair, the cursor does not change to a hand and if I click and drag the crosshair, it moves the entire map instead of just the marker.
Can someone please show me how to do this in 4.14 and beyond? I have not been able to find anything on the web or this site that has been helpful.
TIA
