Hi David,
The smartMapping API is all about generating a new renderer based on the statistics of your data. So the existing renderer on your service doesn't play a factor in this scenario. I'll try to go over the workflow as best I can. Please continue to ask questions if this is still confusing or if it's not exactly what you're looking for.
> 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/FeatureS...
This drawingInfo is ignored in the sample. We want to generate a renderer on our own when the data loads. The renderer we generate will contain the visual variables you're looking for. So we call call colorAndSizeRendererCreator.createContinuousRenderer() to do this. The response object from this method also contains the visual variables conveniently so you don't have to search for specific ones in the renderer. To call the method, first set your params...
var params = {
layer: povLyr,
basemap: map.basemap,
field: "POP",
view: view,
symbolType: "3d-volumetric",
minValue: 0
};
> So how do I set up these important statistics and visualVariables for my schools FeatureLayer by JS code.
When the method resolves you can then grab the generated visual variables and statistics objects and set them in the slider widget. They are properties of the response object. See - univariateColorSize | API Reference | ArcGIS API for JavaScript 4.2
colorAndSizeRendererCreator.createContinuousRenderer(params)
.then(function(response) {
povLyr.renderer = response.renderer;
map.add(povLyr);
var sizeVV = response.size.visualVariable;
var colorVV = response.color.visualVariable;
var sliderParams = {
container: "sliderDiv",
statistics: response.statistics,
visualVariables: [sizeVV, colorVV]
};
var slider = new UnivariateColorSizeSlider(sliderParams);
});
The histogram is optional, but if you want to use that as well, then follow the example code you're looking at.
In short, you don't need visual variables on the default renderer on the layer for this to work. If you already have them, then you can use them without generating the renderer every time the app loads. in that case you could do something like the following:
layer.then(function(){
var renderer = layer.renderer.clone();
sliderParams = {
container: "sliderDiv",
visualVariables: renderer.visualVariables
statistics:
};
});
For the stats use: summaryStatistics | API Reference | ArcGIS API for JavaScript 4.2
But if you use createContinuousRenderer() then this is already done for you under the hood.
> There must be a straightforward code example to set up a common slider scenario with size, color, field max/min values, etc.
This is about as straightforward as it gets. If the snippets on the description page are confusing, then take look at the code in the sandbox. That should provide more context as to where the visual variables and statistics are coming from. We can also look at reworking that description so it doesn't cause as much confusion. I'll be working on a blog post going into a little more depth on this topic. Will link to it when it goes live.
Hope that helps!