I am new to Javascript and somewhat new to GIS (especially web applications of GIS). I'm trying to understand how I can have a drop down menu or html buttons to change which data is rendered in my map.
I have a feature layer hosted on ArcGIS Online, so I don't think I can use ArcGISDynamicMapServiceLayer. This is only if you have ArcGIS Server, right? I only have ArcGIS Desktop.
I can, however, customize my renderer using ClassBreaksRenderer. I thought it would make sense to set up a few different renderers, like so:
var approvalRate = new ClassBreaksRenderer(symbol, "MEAN_appro");
approvalRate.addBreak(0,.19999, new SimpleFillSymbol().setColor(new Color([255, 0, 0, 0.5])));
approvalRate.addBreak(.2,.39999, new SimpleFillSymbol().setColor(new Color([255, 128, 0, 0.5])));
approvalRate.addBreak(.4,.59999, new SimpleFillSymbol().setColor(new Color([255, 255, 0, 0.5])));
approvalRate.addBreak(.6,.79999, new SimpleFillSymbol().setColor(new Color([139, 209, 0, 0.5])));
approvalRate.addBreak(.8,1, new SimpleFillSymbol().setColor(new Color([56, 168, 0, 0.5])));
var averageMortgageAmount = new ClassBreaksRenderer(symbol, "MEAN_dolla");
averageMortgageAmount.addBreak(0, 24.9999, new SimpleFillSymbol().setColor(new Color([255, 0, 0, 0.5])));
averageMortgageAmount.addBreak(25,49.9999, new SimpleFillSymbol().setColor(new Color([255, 128, 0, 0.5])));
averageMortgageAmount.addBreak(50,99.9999, new SimpleFillSymbol().setColor(new Color([255, 255, 0, 0.5])));
averageMortgageAmount.addBreak(100,199.9999, new SimpleFillSymbol().setColor(new Color([139, 209, 0, 0.5])));
averageMortgageAmount.addBreak(200,Infinity, new SimpleFillSymbol().setColor(new Color([56, 168, 0, 0.5])));
So, I have two different renderers set up, called approvalRate and averageMortgageAmount.
I thought I could set up some logic to change which renderer is applied based on user input. So I have set up the renderer variable, get its value from a button, and use that to determine which renderer to use with a switch. Like below.
var renderer;
function getRenderer(rendererFromButton) {
renderer = rendererFromButton;
}
switch(renderer) {
case "Approval Rate":
featureLayer.setRenderer(approvalRate);
break;
case "Average Mortgage Amount":
featureLayer.setRenderer(averageMortgageAmount);
break;
default:
featureLayer.setRenderer(approvalRate);
}
This ends up with a map that correctly renders approvalRate, but never actually changes dynamically. The buttons work right (I've tested the output of the variable "renderer" value after pressing the buttons and it is correct).
It seems like the problem lies in the browser calling the map server again. I don't know what I'm talking about here, but I assume once the map is rendered by the server and sent to the browser as a graphic layer or whatever, it can't be called again and re-rendered.
Is that true?
Here's what I have so far: http://matthewiannowlin.com/planning/thesis/
This is long-winded, but I figured more detail gets a more helpful answer.
Bottom line: is there anyway I can change which field is rendered from an ArcGIS Online feature layer with user input? Do I need to link to different pages that each have different renderers defined? Or do I need to just get ArcGIS Server?