Greetings,
I am trying to combine information from an ArcGIS Server feature layer with attributes from a Salesforce database in a feature layer in a Javascript application. I would like to be able to load a featurelayer into a map application and update the rendere based on attributes that I gather from Salesforce.
My thinking was that I could use the MapView.whenLayerView to get a list of the features within the MapView.extent. Each time the MapView extent changes I could use LayerView.queryFeatures to loop over each graphic, append an attribute to the graphic and then set the symbol of the graphic.
Unfortunately this does not seem to work. Am I doing this wrong? Can this even be done?
Thanks, Tyler
loadFeatureLayers <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">(</SPAN>mapView<SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">=</SPAN><SPAN class="operator token">></SPAN> <SPAN class="punctuation token">{</SPAN>
<SPAN class="keyword token">const</SPAN> self <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">this</SPAN>
<SPAN class="token function">loadModules</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">[</SPAN><SPAN class="string token">'esri/layers/FeatureLayer'</SPAN><SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">.</SPAN><SPAN class="token function">then</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">[</SPAN>FeatureLayer<SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">=</SPAN><SPAN class="operator token">></SPAN>
<SPAN class="punctuation token">{</SPAN>
layers<SPAN class="punctuation token">.</SPAN><SPAN class="token function">forEach</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>layer<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN>
<SPAN class="keyword token">let</SPAN> fl <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">FeatureLayer</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
url<SPAN class="punctuation token">:</SPAN> layer<SPAN class="punctuation token">.</SPAN>url <SPAN class="operator token">+</SPAN> layer<SPAN class="punctuation token">.</SPAN>serviceIndex
<SPAN class="punctuation token">,</SPAN> baseUrl <SPAN class="punctuation token">:</SPAN> layer<SPAN class="punctuation token">.</SPAN>url
<SPAN class="punctuation token">,</SPAN> serviceIndex <SPAN class="punctuation token">:</SPAN> layer<SPAN class="punctuation token">.</SPAN>serviceIndex
<SPAN class="punctuation token">,</SPAN> outFields<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="string token">"*"</SPAN><SPAN class="punctuation token">]</SPAN>
<SPAN class="punctuation token">,</SPAN> popupTemplate<SPAN class="punctuation token">:</SPAN> layer<SPAN class="punctuation token">.</SPAN>popupTemplate
<SPAN class="punctuation token">,</SPAN> definitionExpression<SPAN class="punctuation token">:</SPAN> layer<SPAN class="punctuation token">.</SPAN>definitionExpression
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
fl<SPAN class="punctuation token">.</SPAN>minScale <SPAN class="operator token">=</SPAN> layer<SPAN class="punctuation token">.</SPAN>minScale<SPAN class="punctuation token">;</SPAN>
fl<SPAN class="punctuation token">.</SPAN>renderer <SPAN class="operator token">=</SPAN> layer<SPAN class="punctuation token">.</SPAN>classrenderer
fl<SPAN class="punctuation token">.</SPAN><SPAN class="token function">when</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>featureLayer<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN>
featureLayer<SPAN class="punctuation token">.</SPAN>id <SPAN class="operator token">=</SPAN> layer<SPAN class="punctuation token">.</SPAN>id<SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">let</SPAN> layersConcat <SPAN class="operator token">=</SPAN> self<SPAN class="punctuation token">.</SPAN>state<SPAN class="punctuation token">.</SPAN>layers<SPAN class="punctuation token">.</SPAN><SPAN class="token function">concat</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN><SPAN class="string token">'featureLayerId'</SPAN> <SPAN class="punctuation token">:</SPAN> featureLayer<SPAN class="punctuation token">.</SPAN>id<SPAN class="punctuation token">,</SPAN> <SPAN class="string token">'identifyable'</SPAN> <SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">true</SPAN><SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN>
self<SPAN class="punctuation token">.</SPAN><SPAN class="token function">setState</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>layers<SPAN class="punctuation token">:</SPAN> layersConcat<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="comment token">//fl.renderer = layer.renderer</SPAN>
mapView<SPAN class="punctuation token">.</SPAN>map<SPAN class="punctuation token">.</SPAN><SPAN class="token function">add</SPAN><SPAN class="punctuation token">(</SPAN>fl<SPAN class="punctuation token">)</SPAN>
mapView<SPAN class="punctuation token">.</SPAN><SPAN class="token function">whenLayerView</SPAN><SPAN class="punctuation token">(</SPAN>fl<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">then</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>layerView<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
layerView<SPAN class="punctuation token">.</SPAN><SPAN class="token function">watch</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"updating"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>value<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
<SPAN class="keyword token">if</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="operator token">!</SPAN>value<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="comment token">// wait for the layer view to finish updating</SPAN>
<SPAN class="comment token">// query all the features available for drawing.</SPAN>
<SPAN class="keyword token">const</SPAN> adoptedSymbol <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">{</SPAN>
<SPAN class="string token">"type"</SPAN><SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"simple-marker"</SPAN> <SPAN class="comment token">// autocasts as new SimpleMarkerSymbol()</SPAN>
<SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"size"</SPAN><SPAN class="punctuation token">:</SPAN> <SPAN class="number token">12</SPAN>
<SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"color"</SPAN><SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"red"</SPAN>
<SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"outline"</SPAN><SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="comment token">// autocasts as new SimpleLineSymbol()</SPAN>
<SPAN class="string token">"width"</SPAN><SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0.5</SPAN>
<SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"color"</SPAN><SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"white"</SPAN>
<SPAN class="punctuation token">}</SPAN>
<SPAN class="punctuation token">}</SPAN>
<SPAN class="keyword token">const</SPAN> unadoptedSymbol <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">{</SPAN>
<SPAN class="string token">"type"</SPAN><SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"simple-marker"</SPAN> <SPAN class="comment token">// autocasts as new SimpleMarkerSymbol()</SPAN>
<SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"size"</SPAN><SPAN class="punctuation token">:</SPAN> <SPAN class="number token">12</SPAN>
<SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"color"</SPAN><SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"blue"</SPAN>
<SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"outline"</SPAN><SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="comment token">// autocasts as new SimpleLineSymbol()</SPAN>
<SPAN class="string token">"width"</SPAN><SPAN class="punctuation token">:</SPAN> <SPAN class="number token">0.3</SPAN>
<SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"color"</SPAN><SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"white"</SPAN>
<SPAN class="punctuation token">}</SPAN>
<SPAN class="punctuation token">}</SPAN>
layerView<SPAN class="punctuation token">.</SPAN><SPAN class="token function">queryFeatures</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
geometry<SPAN class="punctuation token">:</SPAN> mapView<SPAN class="punctuation token">.</SPAN>extent<SPAN class="punctuation token">,</SPAN>
returnGeometry<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">true</SPAN><SPAN class="punctuation token">,</SPAN>
outFields<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="string token">"*"</SPAN><SPAN class="punctuation token">]</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">then</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>results<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
<SPAN class="keyword token">let</SPAN> graphics <SPAN class="operator token">=</SPAN> results<SPAN class="punctuation token">.</SPAN>features<SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">let</SPAN> testVal <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">false</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">let</SPAN> flGraphics <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="punctuation token">]</SPAN>
graphics<SPAN class="punctuation token">.</SPAN><SPAN class="token function">forEach</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>g<SPAN class="punctuation token">,</SPAN> index<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
<SPAN class="keyword token">let</SPAN> graphic <SPAN class="operator token">=</SPAN> JSON<SPAN class="punctuation token">.</SPAN><SPAN class="token function">parse</SPAN><SPAN class="punctuation token">(</SPAN>JSON<SPAN class="punctuation token">.</SPAN><SPAN class="token function">stringify</SPAN><SPAN class="punctuation token">(</SPAN>g<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN>
graphic<SPAN class="punctuation token">.</SPAN>geometry<SPAN class="punctuation token">.</SPAN>type <SPAN class="operator token">=</SPAN> <SPAN class="string token">"point"</SPAN>
<SPAN class="keyword token">let</SPAN> attributes <SPAN class="operator token">=</SPAN> graphic<SPAN class="punctuation token">.</SPAN>attributes
testVal <SPAN class="operator token">=</SPAN> <SPAN class="operator token">!</SPAN>testVal
testVal <SPAN class="operator token">===</SPAN> <SPAN class="keyword token">true</SPAN> <SPAN class="operator token">?</SPAN> graphic<SPAN class="punctuation token">.</SPAN>symbol <SPAN class="operator token">=</SPAN> adoptedSymbol<SPAN class="punctuation token">:</SPAN>graphic<SPAN class="punctuation token">.</SPAN>symbol <SPAN class="operator token">=</SPAN> unadoptedSymbol
attributes<SPAN class="punctuation token">.</SPAN>test <SPAN class="operator token">=</SPAN> testVal
graphic<SPAN class="punctuation token">.</SPAN>attributes <SPAN class="operator token">=</SPAN> attributes
flGraphics<SPAN class="punctuation token">.</SPAN><SPAN class="token function">push</SPAN><SPAN class="punctuation token">(</SPAN>graphic<SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
fl<SPAN class="punctuation token">.</SPAN>source <SPAN class="operator token">=</SPAN> flGraphics
<SPAN class="comment token">//fl.refresh()</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="keyword token">catch</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>error<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
console<SPAN class="punctuation token">.</SPAN><SPAN class="token function">error</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"query failed: "</SPAN><SPAN class="punctuation token">,</SPAN> error<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="punctuation token">}</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>