Is it possible to create a widget that updates the renderer based on user inputed values (weights)?

Question

Essentially I would like to build a web application that allows a user to input values and have those value be multiplied by values in specific fields, thus changing the symbology of each feature (assuming they move across classes). I think this may be possible using the "renderer as a function" method in JavaScript, but I am not sure.

Thanks,

Drew

JordanBaumgardner · Answer

I figured it out for 4.x

JS Bin - Collaborative JavaScript Debugging

var CustomSymbolRenderer = 
 SimpleRenderer.createSubclass(SimpleRenderer,
 {
 getSymbol: function () {
 var sym = this.inherited(arguments);

// Do what you want here to change the symbol

sym.color = new Color([Math.floor(Math.random() * 255) + 1, Math.floor(Math.random() * 255) + 1, Math.floor(Math.random() * 255) + 1, .5]);

this.set("symbol",sym.clone());
 return sym;
 }
 });

Then use this Renderer in your FeatureLayer creation

var myLayer = new FeatureLayer({url: "myurl", renderer: CustomSymbolRenderer});

KristianEkenes · Answer

The sample thejus kambi‌ provided the link to demonstrates how to do this. In a nutshell, you are passing a function with the following signature into the "field" parameter of the renderer: // The function must have a graphic param to access field values // this is just an example for demo purposes. function weightedRenderer (graphic) { var field1Val = graphic.attributes.field1; var field2Val = graphic.attributes.field2; var userInput1 = document.getElementById("foo").value; return (field1Val / field2Val) * userInput1; }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍ var renderer = new ClassBreaksRenderer(null, weightedRenderer); layer.setRenderer(renderer);‍‍‍‍ You would also need to set breaks on your ClassBreaksRenderer, but that is independent of the function. This should be enough to get you started.

DrewMerrill1 · Answer

Thanks for the tip. It is a FeatureLayer. The renderer using a function method seems like the best option, I just can't find any live examples of it being used in practice.