JSAPI 4.2 How exactly to set up visualVariables to generate univariate continuous size and color visualization in 3D

DavidChrest

So I love this great sample with the slider: Generate univariate continuous size and color visualization in 3D | ArcGIS API for JavaScript 4.2  and I want to do something just like this but instead using a simple schools wpoint FeatureLayer with number of students instead of cities with population like the sample shows.

So I add in my code essentially based just like the sample code but just switching out for my schools FeatureLayer. I then get this error: there was an error:  d {name: "size-visual-variable:insufficient-info", message: "Unable to find size scheme", details: undefined}.

Turns out I need to set up my visualVariables (and statistics too) inside the colorAndSizeRendererCreator.createContinuousRenderer(params):

 <SPAN class="keyword token">var</SPAN> sizeVV <SPAN class="operator token">=</SPAN> response<SPAN class="punctuation token">.</SPAN>size<SPAN class="punctuation token">.</SPAN>visualVariable<SPAN class="punctuation token">;</SPAN>
 <SPAN class="keyword token">var</SPAN> colorVV <SPAN class="operator token">=</SPAN> response<SPAN class="punctuation token">.</SPAN>color<SPAN class="punctuation token">.</SPAN>visualVariable<SPAN class="punctuation token">;</SPAN>

sliderParams<SPAN class="punctuation token">.</SPAN>statistics <SPAN class="operator token">=</SPAN> response<SPAN class="punctuation token">.</SPAN>statistics<SPAN class="punctuation token">;</SPAN>
sliderParams<SPAN class="punctuation token">.</SPAN>visualVariables <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">[</SPAN>sizeVV<SPAN class="punctuation token">,</SPAN> colorVV<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>

Turns out the FetureLayer in the sample has this all set up with "Drawing Info" in the FeatureLayer's service:

https://services.arcgis.com/V6ZHFr6zdgNZuVG0/ArcGIS/rest/services/Enriched%20World%20Cities/FeatureServer/0 .

 So how do I set up these important statistics and visualVariables for my schools FeatureLayer by JS code. The snippets below the map in this sample page (Generate univariate continuous size and color visualization in 3D | ArcGIS API for JavaScript 4.2 ) are quite confusing.

Is this refereing to the assigned renderer in my renderer: property in my FeatureLayer?

// set the renderer to the layer povLyr.renderer = response.renderer;

Ande where exacttly atre these sizeVV and colorVV coming from? They are not set up in my rendere.

visualVariables: [ sizeVV, colorVV ]?

// size/color visual variables returned from createContinuousRenderer(),

There must be a straightforward code example to set up a common slider scenario with size, color, field max/min values, etc.  The set-up for the Thematic multivariate 3D visualization shows very well the symbolization syntax (Thematic multivariate visualization (3D) | ArcGIS API for JavaScript 4.2 ) for this slide example I'm pretty lost.

Any help is very much appreciated.

Much Thanks,

David

KristianEkenes

> The only thing I would really want to change programmatically is the min and max symbol size (the cylinders). Is there a way to adjust those properties?

The currently implementation uses the view to determine the min and max size so it varies depending on the scale of the view when the method is called. We're working on improving this so it is more consistent for 3D object symbols despite the scale.

However, if you want to change the min and max sizes, you can do that manually without the smart mapping modules, using the size visual variable. The smart mapping modules don't have to be used to work with the slider widgets though they are convenient for getting the stats and histogram. Here's an example of how to override the sizes after getting back the default renderer: JS Bin - Collaborative JavaScript Debugging 

Remember, these creator functions are all about giving you a good default, or starting point. You can visualize your data anyway you want to! But these modules help give you context if you're unfamiliar with your data or you want to allow others to explore it freely.

I'll take a look at the basemap issues. Note that note all vector tile basemaps will work. Only ones that have an equivalent raster basemap will generate a renderer. The reason for this is because the styles for smart mapping were designed before vector tiles came into the API. This is an issue we're aware of and looking to fix. In the meantime you can use the basemap string id of the basemap that most closely resembles whatever you are using that may be unsupported.