Editable graphics with real-world size

186
2
03-12-2019 02:06 AM
ChristianAlfons
New Contributor II

I want to create a 2D map where PictureMarkerSymbols are scaled based on their real-world size. The user should be able to move and rotate the features. Symbols should be updated (moved/rotated) continuously while editing. I'm using ArcGIS JavaScript API 4.10.


To accomplish this, I tried creating a FeatureLayer with a SizeVariable assigned to its renderer. I used SketchViewModel with FeatureLayer.applyEdits() to move and rotate features based on user input. This approach sort of works, but editing is too laggy because of FeatureLayer.applyEdits() running asynchronously.


As a workaround I tried switching from FeatureLayer to GraphicsLayer, which allowed me to apply edits synchronously and get smooth editing. Since GraphicsLayers don't support SizeVariables, I implemented custom symbol scaling on map scale change. The problem with this approach is that when you zoom in too much the symbols start glitching out (incorrect scaling and skewing).

According to a statement from Esri staff, there is an undocumented symbol max size of 120 pixels:
https://esri.jiveon.com/thread/226717-cut-off-of-symbols-with-webgl

This is probably the cause of my scaling issue.


To support my use case, I think I need at least one of the following features implemented in ArcGIS JavaScript API:
- Updating features in FeatureLayer synchronously
- Using SizeVariable with GraphicsLayer
- Allowing symbol sizes larger than 120 pixels

Or is there perhaps another way to accomplish this?

0 Kudos
2 Replies
JohnGrayson
Esri Regular Contributor

Not sure if this will work, but I would try a hybrid approach where the GraphicsLayer provides the smooth update while editing and then when complete I would use a FeatureLayer and call applyEdits() so that subsequent scale changes are handled correctly the FeatureLayer.

0 Kudos
ChristianAlfons
New Contributor II

The problem with such a hybrid approach is that the user should be allowed to zoom while editing, so I would still have to dynamically scale symbols in the GraphicsLayer (and potentially hit the 120px limit).

0 Kudos