- Home
- :
- All Communities
- :
- Developers
- :
- ArcGIS API for Flex (Retired)
- :
- ArcGIS API for Flex Questions
- :
- Re: Switching layers in an ArcGISDynamicMapService...
- Subscribe to RSS Feed
- Mark Topic as New
- Mark Topic as Read
- Float this Topic for Current User
- Bookmark
- Subscribe
- Mute
- Printer Friendly Page
Switching layers in an ArcGISDynamicMapServiceLayer and rendering the new layer
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
I have a simple application where I'm generating a 5-class choropleth map using one of the ESRI demographic datasets. I want to be able to dynamically switch between different layers (i.e., states or counties) by only displaying one at a time. I'm able to render the quantiles on the initial layer (states), but when I switch to counties I can't figure out how to change the GenerateRendererTask to render the counties.
I plan on implementing this code in an application with many more layers than just two, so I don't want to go about hard-coding in the switch like I've done in the layer_changeHandler function. So in addition to the help with rendering, can someone help me with a more elegant way to do that switch?
Code:
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:esri="http://www.esri.com/2008/ags"
minWidth="955" minHeight="600">
<fx:Script>
<![CDATA[
import com.esri.ags.SpatialReference;
import com.esri.ags.events.DetailsEvent;
import com.esri.ags.events.GenerateRendererEvent;
import com.esri.ags.events.LayerEvent;
import com.esri.ags.geometry.Extent;
import com.esri.ags.layers.supportClasses.AllDetails;
import com.esri.ags.layers.supportClasses.DynamicLayerInfo;
import com.esri.ags.layers.supportClasses.LayerDetails;
import com.esri.ags.layers.supportClasses.LayerDrawingOptions;
import com.esri.ags.layers.supportClasses.LayerMapSource;
import com.esri.ags.renderers.ClassBreaksRenderer;
import com.esri.ags.tasks.supportClasses.ClassBreaksDefinition;
import com.esri.ags.tasks.supportClasses.GenerateRendererParameters;
import mx.controls.Alert;
import mx.events.IndexChangedEvent;
import mx.events.ItemClickEvent;
import mx.rpc.events.FaultEvent;
import spark.components.supportClasses.DropDownController;
import spark.events.IndexChangeEvent;
/**************************************
* Define variables below
**************************************/
private var dynamicLayerInfosArr:Array;
private var layerMapSource:LayerMapSource;
private var generateRendererParams:GenerateRendererParameters = new GenerateRendererParameters();
private var classBreaksDefinition:ClassBreaksDefinition = new ClassBreaksDefinition();
private var layerDetailsArr:Array = [];
private var _breakCount:Number = 5;
private var _classificationMethod:String = ClassBreaksDefinition.CLASSIFY_QUANTILE;
private var _classificationField:String = "pop2000";
[Bindable]
private var colorRampFromColor:uint = 0xFFFFCC;
[Bindable]
private var colorRampToColor:uint = 0x253494;
/**************************************
* Functions below
**************************************/
protected function esriCensus_loadHandler(event:LayerEvent):void
{
dynamicLayerInfosArr = esriCensus.createDynamicLayerInfosFromLayerInfos();
detailsTask.getAllDetails();
}
protected function detailsTask_getAllDetailsCompleteHandler(event:DetailsEvent):void
{
var details:AllDetails = event.allDetails;
layerDetailsArr = details.layersDetails;
var layerDetails:LayerDetails;
for (var i:int = 0; i < layerDetailsArr.length; i++)
{
layerDetails = layerDetailsArr;
if (layerDetails.name.toLowerCase() == "states" && dynamicLayerInfosArr)
{
layerMapSource = DynamicLayerInfo(dynamicLayerInfosArr).source as LayerMapSource;
generateRendererTask.source = layerMapSource;
classBreaksDefinition.breakCount = _breakCount;
classBreaksDefinition.classificationField = _classificationField;
classBreaksDefinition.classificationMethod = _classificationMethod;
classBreaksDefinition.colorRamp = colorRamp;
generateRendererParams.classificationDefinition = classBreaksDefinition;
generateRendererTask.execute(generateRendererParams);
}
}
}
protected function esriService_faultHandler(event:FaultEvent):void
{
Alert.show("Error: " + event.fault.faultString, "Error code: " + event.fault.faultCode);
}
protected function generateRendererTask_executeCompleteHandler(event:GenerateRendererEvent):void
{
var renderer:ClassBreaksRenderer = event.renderer as ClassBreaksRenderer;
var layerDrawingOptions:LayerDrawingOptions = new LayerDrawingOptions();
layerDrawingOptions.layerId = layerMapSource.mapLayerId; //states layer id in the service
layerDrawingOptions.renderer = renderer;
esriCensus.alpha = 0.9;
esriCensus.layerDrawingOptions = [ layerDrawingOptions ];
legend.refresh(); // refresh the legend component to keep in-sync
}
protected function generateRenderer():void
{
classBreaksDefinition.breakCount = _breakCount;
classBreaksDefinition.classificationField = _classificationField;
classBreaksDefinition.classificationMethod = _classificationMethod;
generateRendererParams.classificationDefinition = classBreaksDefinition;
classBreaksDefinition.colorRamp = colorRamp;
generateRendererTask.execute(generateRendererParams);
}
private function decimalToPercentage(decimalValue:Number):String
{
var percentage:Number = decimalValue * 1000;
var roundedPercentage:Number = Math.round(percentage);
var roundedPercentage2:Number = roundedPercentage / 10;
var percentAsString:String = roundedPercentage2 + "%";
return percentAsString;
}
protected function layer_changeHandler(event:IndexChangeEvent):void
{
var selectedItem:Object = DropDownList(event.currentTarget).selectedItem;
esriCensus.visibleLayers.removeAll();
if (selectedItem.data == "states")
{
esriCensus.visibleLayers.addItem(3);
}
else
{
esriCensus.visibleLayers.addItem(2);
}
}
]]>
</fx:Script>
<fx:Declarations>
<esri:DetailsTask id="detailsTask"
fault="esriService_faultHandler(event)"
getAllDetailsComplete="detailsTask_getAllDetailsCompleteHandler(event)"
url="http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer"/>
<esri:GenerateRendererTask id="generateRendererTask"
executeComplete="generateRendererTask_executeCompleteHandler(event)"
fault="esriService_faultHandler(event)"
url="http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/3"/>
<esri:AlgorithmicColorRamp id="colorRamp"
algorithm="esriHSVAlgorithm"
fromColor="{colorRampFromColor}"
toColor="{colorRampToColor}"/>
</fx:Declarations>
<s:controlBarContent>
<s:RichText width="100%">
Project text here...
</s:RichText>
</s:controlBarContent>
<!-- MAP ELEMENTS -->
<esri:Map id="map" logoVisible="false">
<esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/arcgis/rest/services/Ocean_Basemap/MapServer"/>
<!-- Define the dynamic layers below -->
<esri:ArcGISDynamicMapServiceLayer id="esriCensus" name="Pop 2000"
alpha="0.9"
load="esriCensus_loadHandler(event)"
url="http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer"
visible="true">
<esri:visibleLayers>
<s:ArrayList>
<fx:Number>3</fx:Number>
</s:ArrayList>
</esri:visibleLayers>
</esri:ArcGISDynamicMapServiceLayer>
<!-- Define the map extent below -->
<esri:extent>
<esri:Extent xmin="-16971000" ymin="615000" xmax="-4448000" ymax="8110000">
<esri:SpatialReference wkid="102100"/>
</esri:Extent>
</esri:extent>
</esri:Map>
<!-- LAYER WINDOW -->
<s:Group id="layerGroup"
width="150" height="100"
left="100" top="20">
<s:RectangularDropShadow left="0" right="0" top="0" bottom="0"
alpha="1"
angle="90"
blRadius="5"
blurX="6"
blurY="6"
brRadius="5"
color="#000000"
distance="1"
tlRadius="5"
trRadius="5"/>
<s:Rect left="0" right="0" top="0" bottom="0"
radiusX="5"
radiusY="5">
<s:fill>
<s:SolidColor alpha="0.7" color="0xC5C5C9"/>
</s:fill>
</s:Rect>
<s:VGroup width="100%"
left="5" top="5"
paddingBottom="5"
paddingLeft="5"
paddingRight="5"
paddingTop="10">
<s:HGroup width="100%"
gap="5"
verticalAlign="middle">
<s:Label text="Layer"/>
<s:DropDownList width="100%"
change="layer_changeHandler(event)"
requireSelection="true"
selectedIndex="0">
<s:dataProvider>
<s:ArrayList>
<fx:Object data="states" label="States"/>
<fx:Object data="counties" label="Counties"/>
</s:ArrayList>
</s:dataProvider>
</s:DropDownList>
</s:HGroup>
</s:VGroup>
</s:Group>
<!-- LEGEND WINDOW -->
<s:Group id="legendGroup"
width="250" height="250"
right="5" bottom="20">
<s:RectangularDropShadow left="0" right="0" top="0" bottom="0"
alpha="1"
angle="90"
blRadius="5"
blurX="6"
blurY="6"
brRadius="5"
color="#000000"
distance="1"
tlRadius="5"
trRadius="5"/>
<s:Rect left="0" right="0" top="0" bottom="0"
radiusX="5"
radiusY="5">
<s:fill>
<s:SolidColor alpha="0.7" color="0xC5C5C9"/>
</s:fill>
</s:Rect>
<esri:Legend id="legend"
left="5" right="5" top="5" bottom="5"
layers="{[esriCensus]}"
map="{map}"
skinClass="com.esri.ags.samples.skins.GRLegendSkin"
visible="{esriCensus.loaded}"/>
</s:Group>
</s:Application>
Solved! Go to Solution.
Accepted Solutions
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Brian,
So here is the renderer changing based on your selection in the dropdown.
- I had to change several things but notice the dropdownlist dataprovider uses the layer id from the map service as the data and not a string like you began with.
- I use a dictionary to keep track of the layerMapSource info, base url, and layer id
- In the detailsTask_getAllDetailsCompleteHandler I removed the if statement that only proceeded if it was the states layer.
- In the layer_changeHandler I check for the dropdownlists data get proper url for the generate renderer function.
You have more work to do if you want this to work with more than one Map Service though.
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:esri="http://www.esri.com/2008/ags"
minWidth="955" minHeight="600">
<fx:Script>
<![CDATA[
import com.esri.ags.SpatialReference;
import com.esri.ags.events.DetailsEvent;
import com.esri.ags.events.GenerateRendererEvent;
import com.esri.ags.events.LayerEvent;
import com.esri.ags.geometry.Extent;
import com.esri.ags.layers.supportClasses.AllDetails;
import com.esri.ags.layers.supportClasses.DynamicLayerInfo;
import com.esri.ags.layers.supportClasses.LayerDetails;
import com.esri.ags.layers.supportClasses.LayerDrawingOptions;
import com.esri.ags.layers.supportClasses.LayerMapSource;
import com.esri.ags.renderers.ClassBreaksRenderer;
import com.esri.ags.tasks.supportClasses.ClassBreaksDefinition;
import com.esri.ags.tasks.supportClasses.GenerateRendererParameters;
import mx.controls.Alert;
import mx.rpc.events.FaultEvent;
import spark.events.IndexChangeEvent;
/**************************************
* Define variables below
**************************************/
private var dynamicLayerInfosArr:Array;
private var layerMapSource:LayerMapSource;
private var generateRendererParams:GenerateRendererParameters = new GenerateRendererParameters();
private var classBreaksDefinition:ClassBreaksDefinition = new ClassBreaksDefinition();
private var layerDetailsArr:Array = [];
private var _breakCount:Number = 5;
private var _classificationMethod:String = ClassBreaksDefinition.CLASSIFY_QUANTILE;
private var _classificationField:String = "pop2000";
[Bindable]
private var colorRampFromColor:uint = 0xFFFFCC;
[Bindable]
private var colorRampToColor:uint = 0x253494;
private var layerMapSourceDict:Dictionary = new Dictionary();
/**************************************
* Functions below
**************************************/
protected function esriCensus_loadHandler(event:LayerEvent):void
{
dynamicLayerInfosArr = esriCensus.createDynamicLayerInfosFromLayerInfos();
detailsTask.getAllDetails();
}
protected function detailsTask_getAllDetailsCompleteHandler(event:DetailsEvent):void
{
var details:AllDetails = event.allDetails;
layerDetailsArr = details.layersDetails;
var layerDetails:LayerDetails;
for (var i:int = 0; i < layerDetailsArr.length; i++)
{
layerDetails = layerDetailsArr;
if (dynamicLayerInfosArr)
{
layerMapSource = DynamicLayerInfo(dynamicLayerInfosArr).source as LayerMapSource;
layerMapSourceDict = {
layermapsource: layerMapSource,
layerid: layerMapSource.mapLayerId,
baseurl: "http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer"
}
generateRendererTask.source = layerMapSource;
classBreaksDefinition.breakCount = _breakCount;
classBreaksDefinition.classificationField = _classificationField;
classBreaksDefinition.classificationMethod = _classificationMethod;
classBreaksDefinition.colorRamp = colorRamp;
generateRendererParams.classificationDefinition = classBreaksDefinition;
generateRendererTask.execute(generateRendererParams);
}
}
}
protected function esriService_faultHandler(event:FaultEvent):void
{
Alert.show("Error: " + event.fault.faultString, "Error code: " + event.fault.faultCode);
}
protected function generateRendererTask_executeCompleteHandler(event:GenerateRendererEvent):void
{
var renderer:ClassBreaksRenderer = event.renderer as ClassBreaksRenderer;
var layerDrawingOptions:LayerDrawingOptions = new LayerDrawingOptions();
layerDrawingOptions.layerId = layerMapSource.mapLayerId; //states layer id in the service
layerDrawingOptions.renderer = renderer;
esriCensus.alpha = 0.9;
esriCensus.layerDrawingOptions = [ layerDrawingOptions ];
legend.refresh(); // refresh the legend component to keep in-sync
}
protected function generateRenderer():void
{
classBreaksDefinition.breakCount = _breakCount;
classBreaksDefinition.classificationField = _classificationField;
classBreaksDefinition.classificationMethod = _classificationMethod;
generateRendererParams.classificationDefinition = classBreaksDefinition;
classBreaksDefinition.colorRamp = colorRamp;
generateRendererTask.execute(generateRendererParams);
}
private function decimalToPercentage(decimalValue:Number):String
{
var percentage:Number = decimalValue * 1000;
var roundedPercentage:Number = Math.round(percentage);
var roundedPercentage2:Number = roundedPercentage / 10;
var percentAsString:String = roundedPercentage2 + "%";
return percentAsString;
}
protected function layer_changeHandler(event:IndexChangeEvent):void
{
var selectedItem:Object = DropDownList(event.currentTarget).selectedItem;
esriCensus.visibleLayers.removeAll();
esriCensus.visibleLayers.addItem(layerMapSourceDict[selectedItem.data].layerid);
generateRendererTask.url = layerMapSourceDict[selectedItem.data].baseurl + "/" + layerMapSourceDict[selectedItem.data].layerid;
layerMapSource = layerMapSourceDict[selectedItem.data].layermapsource;
generateRenderer();
}
]]>
</fx:Script>
<fx:Declarations>
<esri:DetailsTask id="detailsTask"
fault="esriService_faultHandler(event)"
getAllDetailsComplete="detailsTask_getAllDetailsCompleteHandler(event)"
url="http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer"/>
<esri:GenerateRendererTask id="generateRendererTask"
executeComplete="generateRendererTask_executeCompleteHandler(event)"
fault="esriService_faultHandler(event)"
url="http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/3"/>
<esri:AlgorithmicColorRamp id="colorRamp"
algorithm="esriHSVAlgorithm"
fromColor="{colorRampFromColor}"
toColor="{colorRampToColor}"/>
</fx:Declarations>
<s:controlBarContent>
<s:RichText width="100%">
Project text here...
</s:RichText>
</s:controlBarContent>
<!-- MAP ELEMENTS -->
<esri:Map id="map" logoVisible="false">
<esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/arcgis/rest/services/Ocean_Basemap/MapServer"/>
<!-- Define the dynamic layers below -->
<esri:ArcGISDynamicMapServiceLayer id="esriCensus" name="Pop 2000"
alpha="0.9"
load="esriCensus_loadHandler(event)"
url="http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer"
visible="true">
<esri:visibleLayers>
<s:ArrayList>
<fx:Number>3</fx:Number>
</s:ArrayList>
</esri:visibleLayers>
</esri:ArcGISDynamicMapServiceLayer>
<!-- Define the map extent below -->
<esri:extent>
<esri:Extent xmin="-16971000" ymin="615000" xmax="-4448000" ymax="8110000">
<esri:SpatialReference wkid="102100"/>
</esri:Extent>
</esri:extent>
</esri:Map>
<!-- LAYER WINDOW -->
<s:Group id="layerGroup"
width="150" height="100"
left="100" top="20">
<s:RectangularDropShadow left="0" right="0" top="0" bottom="0"
alpha="1"
angle="90"
blRadius="5"
blurX="6"
blurY="6"
brRadius="5"
color="#000000"
distance="1"
tlRadius="5"
trRadius="5"/>
<s:Rect left="0" right="0" top="0" bottom="0"
radiusX="5"
radiusY="5">
<s:fill>
<s:SolidColor alpha="0.7" color="0xC5C5C9"/>
</s:fill>
</s:Rect>
<s:VGroup width="100%"
left="5" top="5"
paddingBottom="5"
paddingLeft="5"
paddingRight="5"
paddingTop="10">
<s:HGroup width="100%"
gap="5"
verticalAlign="middle">
<s:Label text="Layer"/>
<s:DropDownList width="100%"
change="layer_changeHandler(event)"
requireSelection="true"
selectedIndex="0">
<s:dataProvider>
<s:ArrayList>
<fx:Object data="3" label="States"/>
<fx:Object data="2" label="Counties"/>
</s:ArrayList>
</s:dataProvider>
</s:DropDownList>
</s:HGroup>
</s:VGroup>
</s:Group>
<!-- LEGEND WINDOW -->
<s:Group id="legendGroup"
width="250" height="250"
right="5" bottom="20">
<s:RectangularDropShadow left="0" right="0" top="0" bottom="0"
alpha="1"
angle="90"
blRadius="5"
blurX="6"
blurY="6"
brRadius="5"
color="#000000"
distance="1"
tlRadius="5"
trRadius="5"/>
<s:Rect left="0" right="0" top="0" bottom="0"
radiusX="5"
radiusY="5">
<s:fill>
<s:SolidColor alpha="0.7" color="0xC5C5C9"/>
</s:fill>
</s:Rect>
<esri:Legend id="legend"
left="5" right="5" top="5" bottom="5"
layers="{[esriCensus]}"
map="{map}"
visible="{esriCensus.loaded}"/>
</s:Group>
</s:Application>
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Brian,
So here is the renderer changing based on your selection in the dropdown.
- I had to change several things but notice the dropdownlist dataprovider uses the layer id from the map service as the data and not a string like you began with.
- I use a dictionary to keep track of the layerMapSource info, base url, and layer id
- In the detailsTask_getAllDetailsCompleteHandler I removed the if statement that only proceeded if it was the states layer.
- In the layer_changeHandler I check for the dropdownlists data get proper url for the generate renderer function.
You have more work to do if you want this to work with more than one Map Service though.
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:esri="http://www.esri.com/2008/ags"
minWidth="955" minHeight="600">
<fx:Script>
<![CDATA[
import com.esri.ags.SpatialReference;
import com.esri.ags.events.DetailsEvent;
import com.esri.ags.events.GenerateRendererEvent;
import com.esri.ags.events.LayerEvent;
import com.esri.ags.geometry.Extent;
import com.esri.ags.layers.supportClasses.AllDetails;
import com.esri.ags.layers.supportClasses.DynamicLayerInfo;
import com.esri.ags.layers.supportClasses.LayerDetails;
import com.esri.ags.layers.supportClasses.LayerDrawingOptions;
import com.esri.ags.layers.supportClasses.LayerMapSource;
import com.esri.ags.renderers.ClassBreaksRenderer;
import com.esri.ags.tasks.supportClasses.ClassBreaksDefinition;
import com.esri.ags.tasks.supportClasses.GenerateRendererParameters;
import mx.controls.Alert;
import mx.rpc.events.FaultEvent;
import spark.events.IndexChangeEvent;
/**************************************
* Define variables below
**************************************/
private var dynamicLayerInfosArr:Array;
private var layerMapSource:LayerMapSource;
private var generateRendererParams:GenerateRendererParameters = new GenerateRendererParameters();
private var classBreaksDefinition:ClassBreaksDefinition = new ClassBreaksDefinition();
private var layerDetailsArr:Array = [];
private var _breakCount:Number = 5;
private var _classificationMethod:String = ClassBreaksDefinition.CLASSIFY_QUANTILE;
private var _classificationField:String = "pop2000";
[Bindable]
private var colorRampFromColor:uint = 0xFFFFCC;
[Bindable]
private var colorRampToColor:uint = 0x253494;
private var layerMapSourceDict:Dictionary = new Dictionary();
/**************************************
* Functions below
**************************************/
protected function esriCensus_loadHandler(event:LayerEvent):void
{
dynamicLayerInfosArr = esriCensus.createDynamicLayerInfosFromLayerInfos();
detailsTask.getAllDetails();
}
protected function detailsTask_getAllDetailsCompleteHandler(event:DetailsEvent):void
{
var details:AllDetails = event.allDetails;
layerDetailsArr = details.layersDetails;
var layerDetails:LayerDetails;
for (var i:int = 0; i < layerDetailsArr.length; i++)
{
layerDetails = layerDetailsArr;
if (dynamicLayerInfosArr)
{
layerMapSource = DynamicLayerInfo(dynamicLayerInfosArr).source as LayerMapSource;
layerMapSourceDict = {
layermapsource: layerMapSource,
layerid: layerMapSource.mapLayerId,
baseurl: "http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer"
}
generateRendererTask.source = layerMapSource;
classBreaksDefinition.breakCount = _breakCount;
classBreaksDefinition.classificationField = _classificationField;
classBreaksDefinition.classificationMethod = _classificationMethod;
classBreaksDefinition.colorRamp = colorRamp;
generateRendererParams.classificationDefinition = classBreaksDefinition;
generateRendererTask.execute(generateRendererParams);
}
}
}
protected function esriService_faultHandler(event:FaultEvent):void
{
Alert.show("Error: " + event.fault.faultString, "Error code: " + event.fault.faultCode);
}
protected function generateRendererTask_executeCompleteHandler(event:GenerateRendererEvent):void
{
var renderer:ClassBreaksRenderer = event.renderer as ClassBreaksRenderer;
var layerDrawingOptions:LayerDrawingOptions = new LayerDrawingOptions();
layerDrawingOptions.layerId = layerMapSource.mapLayerId; //states layer id in the service
layerDrawingOptions.renderer = renderer;
esriCensus.alpha = 0.9;
esriCensus.layerDrawingOptions = [ layerDrawingOptions ];
legend.refresh(); // refresh the legend component to keep in-sync
}
protected function generateRenderer():void
{
classBreaksDefinition.breakCount = _breakCount;
classBreaksDefinition.classificationField = _classificationField;
classBreaksDefinition.classificationMethod = _classificationMethod;
generateRendererParams.classificationDefinition = classBreaksDefinition;
classBreaksDefinition.colorRamp = colorRamp;
generateRendererTask.execute(generateRendererParams);
}
private function decimalToPercentage(decimalValue:Number):String
{
var percentage:Number = decimalValue * 1000;
var roundedPercentage:Number = Math.round(percentage);
var roundedPercentage2:Number = roundedPercentage / 10;
var percentAsString:String = roundedPercentage2 + "%";
return percentAsString;
}
protected function layer_changeHandler(event:IndexChangeEvent):void
{
var selectedItem:Object = DropDownList(event.currentTarget).selectedItem;
esriCensus.visibleLayers.removeAll();
esriCensus.visibleLayers.addItem(layerMapSourceDict[selectedItem.data].layerid);
generateRendererTask.url = layerMapSourceDict[selectedItem.data].baseurl + "/" + layerMapSourceDict[selectedItem.data].layerid;
layerMapSource = layerMapSourceDict[selectedItem.data].layermapsource;
generateRenderer();
}
]]>
</fx:Script>
<fx:Declarations>
<esri:DetailsTask id="detailsTask"
fault="esriService_faultHandler(event)"
getAllDetailsComplete="detailsTask_getAllDetailsCompleteHandler(event)"
url="http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer"/>
<esri:GenerateRendererTask id="generateRendererTask"
executeComplete="generateRendererTask_executeCompleteHandler(event)"
fault="esriService_faultHandler(event)"
url="http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/3"/>
<esri:AlgorithmicColorRamp id="colorRamp"
algorithm="esriHSVAlgorithm"
fromColor="{colorRampFromColor}"
toColor="{colorRampToColor}"/>
</fx:Declarations>
<s:controlBarContent>
<s:RichText width="100%">
Project text here...
</s:RichText>
</s:controlBarContent>
<!-- MAP ELEMENTS -->
<esri:Map id="map" logoVisible="false">
<esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/arcgis/rest/services/Ocean_Basemap/MapServer"/>
<!-- Define the dynamic layers below -->
<esri:ArcGISDynamicMapServiceLayer id="esriCensus" name="Pop 2000"
alpha="0.9"
load="esriCensus_loadHandler(event)"
url="http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer"
visible="true">
<esri:visibleLayers>
<s:ArrayList>
<fx:Number>3</fx:Number>
</s:ArrayList>
</esri:visibleLayers>
</esri:ArcGISDynamicMapServiceLayer>
<!-- Define the map extent below -->
<esri:extent>
<esri:Extent xmin="-16971000" ymin="615000" xmax="-4448000" ymax="8110000">
<esri:SpatialReference wkid="102100"/>
</esri:Extent>
</esri:extent>
</esri:Map>
<!-- LAYER WINDOW -->
<s:Group id="layerGroup"
width="150" height="100"
left="100" top="20">
<s:RectangularDropShadow left="0" right="0" top="0" bottom="0"
alpha="1"
angle="90"
blRadius="5"
blurX="6"
blurY="6"
brRadius="5"
color="#000000"
distance="1"
tlRadius="5"
trRadius="5"/>
<s:Rect left="0" right="0" top="0" bottom="0"
radiusX="5"
radiusY="5">
<s:fill>
<s:SolidColor alpha="0.7" color="0xC5C5C9"/>
</s:fill>
</s:Rect>
<s:VGroup width="100%"
left="5" top="5"
paddingBottom="5"
paddingLeft="5"
paddingRight="5"
paddingTop="10">
<s:HGroup width="100%"
gap="5"
verticalAlign="middle">
<s:Label text="Layer"/>
<s:DropDownList width="100%"
change="layer_changeHandler(event)"
requireSelection="true"
selectedIndex="0">
<s:dataProvider>
<s:ArrayList>
<fx:Object data="3" label="States"/>
<fx:Object data="2" label="Counties"/>
</s:ArrayList>
</s:dataProvider>
</s:DropDownList>
</s:HGroup>
</s:VGroup>
</s:Group>
<!-- LEGEND WINDOW -->
<s:Group id="legendGroup"
width="250" height="250"
right="5" bottom="20">
<s:RectangularDropShadow left="0" right="0" top="0" bottom="0"
alpha="1"
angle="90"
blRadius="5"
blurX="6"
blurY="6"
brRadius="5"
color="#000000"
distance="1"
tlRadius="5"
trRadius="5"/>
<s:Rect left="0" right="0" top="0" bottom="0"
radiusX="5"
radiusY="5">
<s:fill>
<s:SolidColor alpha="0.7" color="0xC5C5C9"/>
</s:fill>
</s:Rect>
<esri:Legend id="legend"
left="5" right="5" top="5" bottom="5"
layers="{[esriCensus]}"
map="{map}"
visible="{esriCensus.loaded}"/>
</s:Group>
</s:Application>
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Robert,
That's perfect! Thank you so much for your help. It's great to know the community has you as a resource.
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
I'm stuck on another aspect of this same script (pasted below). I have simply switched the initial layer above from States (3) to Counties (2). In doing so, the application does not render the Counties layer properly. I've determined that the code in the detailsTask_getAllDetailsCompleteHandler function is setting layerMapSource to the last layer in the ArcGISDynamicMapServiceLayer. In this case, that's States. Once I change the layer in the dropdown, it renders both States and Counties properly. But I cannot figure out how to get the code to properly render the Counties layer if it is the first one to display.
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:esri="http://www.esri.com/2008/ags"
minWidth="955" minHeight="600">
<fx:Script>
<![CDATA[
import com.esri.ags.SpatialReference;
import com.esri.ags.events.DetailsEvent;
import com.esri.ags.events.GenerateRendererEvent;
import com.esri.ags.events.LayerEvent;
import com.esri.ags.geometry.Extent;
import com.esri.ags.layers.supportClasses.AllDetails;
import com.esri.ags.layers.supportClasses.DynamicLayerInfo;
import com.esri.ags.layers.supportClasses.LayerDetails;
import com.esri.ags.layers.supportClasses.LayerDrawingOptions;
import com.esri.ags.layers.supportClasses.LayerMapSource;
import com.esri.ags.renderers.ClassBreaksRenderer;
import com.esri.ags.tasks.supportClasses.ClassBreaksDefinition;
import com.esri.ags.tasks.supportClasses.GenerateRendererParameters;
import mx.controls.Alert;
import mx.rpc.events.FaultEvent;
import spark.events.IndexChangeEvent;
/**************************************
* Define variables below
**************************************/
private var dynamicLayerInfosArr:Array;
private var layerMapSource:LayerMapSource;
private var generateRendererParams:GenerateRendererParameters = new GenerateRendererParameters();
private var classBreaksDefinition:ClassBreaksDefinition = new ClassBreaksDefinition();
private var layerDetailsArr:Array = [];
private var _breakCount:Number = 5;
private var _classificationMethod:String = ClassBreaksDefinition.CLASSIFY_QUANTILE;
private var _classificationField:String = "pop2000";
[Bindable]
private var thematicAlpha:Number = 0.9;
[Bindable]
private var thematicLayerName:String;
[Bindable]
private var colorRampFromColor:uint = 0xFFFFCC;
[Bindable]
private var colorRampToColor:uint = 0x253494;
[Bindable]
private var thematicBoundaryAlpha:Number = 0.9;
private var layerMapSourceDict:Dictionary = new Dictionary();
/**************************************
* Functions below
**************************************/
protected function esriCensus_loadHandler(event:LayerEvent):void
{
dynamicLayerInfosArr = esriCensus.createDynamicLayerInfosFromLayerInfos();
detailsTask.getAllDetails();
}
protected function detailsTask_getAllDetailsCompleteHandler(event:DetailsEvent):void
{
var details:AllDetails = event.allDetails;
layerDetailsArr = details.layersDetails;
var layerDetails:LayerDetails;
for (var i:int = 0; i < layerDetailsArr.length; i++)
{
layerDetails = layerDetailsArr;
if (dynamicLayerInfosArr)
{
layerMapSource = DynamicLayerInfo(dynamicLayerInfosArr).source as LayerMapSource;
var lid:Number = layerMapSource.mapLayerId;
layerMapSourceDict = {
layermapsource: layerMapSource,
layerid: lid,
baseurl: "http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer"
}
generateRendererTask.source = layerMapSource;
classBreaksDefinition.breakCount = _breakCount;
classBreaksDefinition.classificationField = _classificationField;
classBreaksDefinition.classificationMethod = _classificationMethod;
classBreaksDefinition.colorRamp = colorRamp;
classBreaksDefinition.baseSymbol = thematicLayerBoundary;
generateRendererParams.classificationDefinition = classBreaksDefinition;
generateRendererTask.execute(generateRendererParams);
}
}
}
protected function esriService_faultHandler(event:FaultEvent):void
{
Alert.show("Error: " + event.fault.faultString, "Error code: " + event.fault.faultCode);
}
protected function generateRendererTask_executeCompleteHandler(event:GenerateRendererEvent):void
{
var renderer:ClassBreaksRenderer = event.renderer as ClassBreaksRenderer;
var layerDrawingOptions:LayerDrawingOptions = new LayerDrawingOptions();
layerDrawingOptions.layerId = layerMapSource.mapLayerId;
layerDrawingOptions.renderer = renderer;
esriCensus.alpha = 0.9;
esriCensus.layerDrawingOptions = [ layerDrawingOptions ];
legend.refresh();
}
protected function generateRenderer():void
{
classBreaksDefinition.breakCount = _breakCount;
classBreaksDefinition.classificationField = _classificationField;
classBreaksDefinition.classificationMethod = _classificationMethod;
generateRendererParams.classificationDefinition = classBreaksDefinition;
generateRendererTask.execute(generateRendererParams);
}
private function decimalToPercentage(decimalValue:Number):String
{
var percentage:Number = decimalValue * 1000;
var roundedPercentage:Number = Math.round(percentage);
var roundedPercentage2:Number = roundedPercentage / 10;
var percentAsString:String = roundedPercentage2 + "%";
return percentAsString;
}
protected function layer_changeHandler(event:IndexChangeEvent):void
{
var selectedItem:Object = DropDownList(event.currentTarget).selectedItem;
esriCensus.visibleLayers.removeAll();
esriCensus.visibleLayers.addItem(layerMapSourceDict[selectedItem.data].layerid);
generateRendererTask.url = layerMapSourceDict[selectedItem.data].baseurl + "/" + layerMapSourceDict[selectedItem.data].layerid;
layerMapSource = layerMapSourceDict[selectedItem.data].layermapsource;
generateRenderer();
}
]]>
</fx:Script>
<fx:Declarations>
<esri:DetailsTask id="detailsTask"
fault="esriService_faultHandler(event)"
getAllDetailsComplete="detailsTask_getAllDetailsCompleteHandler(event)"
url="http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer"/>
<esri:GenerateRendererTask id="generateRendererTask"
executeComplete="generateRendererTask_executeCompleteHandler(event)"
fault="esriService_faultHandler(event)"
url="http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/2"/>
<esri:AlgorithmicColorRamp id="colorRamp"
algorithm="esriHSVAlgorithm"
fromColor="{colorRampFromColor}"
toColor="{colorRampToColor}"/>
<!-- Base symbology for the boundaries of the thematic layers -->
<esri:SimpleFillSymbol id="thematicLayerBoundary" alpha="0">
<esri:SimpleLineSymbol id="thematicLayerBoundaryLine" width="1" color="0x6E6E6E" alpha="{thematicBoundaryAlpha}"/>
</esri:SimpleFillSymbol>
</fx:Declarations>
<s:controlBarContent>
<s:RichText width="100%">
Project text here...
</s:RichText>
</s:controlBarContent>
<!-- MAP ELEMENTS -->
<esri:Map id="map" logoVisible="false">
<esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/arcgis/rest/services/Ocean_Basemap/MapServer"/>
<!-- Define the dynamic layers below -->
<esri:ArcGISDynamicMapServiceLayer id="esriCensus" name="Pop 2000"
alpha="0.9"
load="esriCensus_loadHandler(event)"
url="http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer"
visible="true">
<esri:visibleLayers>
<s:ArrayList>
<fx:Number>2</fx:Number>
</s:ArrayList>
</esri:visibleLayers>
</esri:ArcGISDynamicMapServiceLayer>
<!-- Define the map extent below -->
<esri:extent>
<esri:Extent xmin="-16971000" ymin="615000" xmax="-4448000" ymax="8110000">
<esri:SpatialReference wkid="102100"/>
</esri:Extent>
</esri:extent>
</esri:Map>
<!-- LAYER WINDOW -->
<s:Group id="layerGroup"
width="150" height="100"
left="100" top="20">
<s:RectangularDropShadow left="0" right="0" top="0" bottom="0"
alpha="1"
angle="90"
blRadius="5"
blurX="6"
blurY="6"
brRadius="5"
color="#000000"
distance="1"
tlRadius="5"
trRadius="5"/>
<s:Rect left="0" right="0" top="0" bottom="0"
radiusX="5"
radiusY="5">
<s:fill>
<s:SolidColor alpha="0.7" color="0xC5C5C9"/>
</s:fill>
</s:Rect>
<s:VGroup width="100%"
left="5" top="5"
paddingBottom="5"
paddingLeft="5"
paddingRight="5"
paddingTop="10">
<s:HGroup width="100%"
gap="5"
verticalAlign="middle">
<s:Label text="Layer"/>
<s:DropDownList id="layerDDL"
width="100%"
change="layer_changeHandler(event)"
requireSelection="true"
selectedIndex="0">
<s:dataProvider>
<s:ArrayList>
<fx:Object data="2" label="Counties"/>
<fx:Object data="3" label="States"/>
</s:ArrayList>
</s:dataProvider>
</s:DropDownList>
</s:HGroup>
</s:VGroup>
</s:Group>
<!-- LEGEND WINDOW -->
<s:Group id="legendGroup"
width="250" height="250"
right="5" bottom="20">
<s:RectangularDropShadow left="0" right="0" top="0" bottom="0"
alpha="1"
angle="90"
blRadius="5"
blurX="6"
blurY="6"
brRadius="5"
color="#000000"
distance="1"
tlRadius="5"
trRadius="5"/>
<s:Rect left="0" right="0" top="0" bottom="0"
radiusX="5"
radiusY="5">
<s:fill>
<s:SolidColor alpha="0.7" color="0xC5C5C9"/>
</s:fill>
</s:Rect>
<esri:Legend id="legend"
left="5" right="5" top="5" bottom="5"
layers="{[esriCensus]}"
map="{map}"
skinClass="com.esri.ags.samples.skins.GRLegendSkin"
visible="{esriCensus.loaded}"/>
</s:Group>
</s:Application>
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Brain,
Sure the detailTask_getAllDetailsCompleteHandler loops though all the layer ids in the map service so it is logical that the last layer will be set in the layerMapSource. The fact that it does loop though all the layers and adds them to a dictionary means that all you have to do is set the layerMapSource to the proper id of the layer you want to begin with. Here is the code you need to set it to the first layer id that is selected in your dropdown list:
protected function detailsTask_getAllDetailsCompleteHandler(event:DetailsEvent):void
{
var details:AllDetails = event.allDetails;
layerDetailsArr = details.layersDetails;
var layerDetails:LayerDetails;
for (var i:int = 0; i < layerDetailsArr.length; i++)
{
layerDetails = layerDetailsArr;
if (dynamicLayerInfosArr)
{
layerMapSource = DynamicLayerInfo(dynamicLayerInfosArr).source as LayerMapSource;
var lid:Number = layerMapSource.mapLayerId;
layerMapSourceDict = {
layermapsource: layerMapSource,
layerid: lid,
baseurl: "http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer"
}
generateRendererTask.source = layerMapSource;
classBreaksDefinition.breakCount = _breakCount;
classBreaksDefinition.classificationField = _classificationField;
classBreaksDefinition.classificationMethod = _classificationMethod;
classBreaksDefinition.colorRamp = colorRamp;
classBreaksDefinition.baseSymbol = thematicLayerBoundary;
generateRendererParams.classificationDefinition = classBreaksDefinition;
generateRendererTask.execute(generateRendererParams);
}
}
//Import part is next two lines
var selectedItem:Object = layerDDL.selectedItem;
layerMapSource = layerMapSourceDict[selectedItem.data].layermapsource;
}
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Amazing. I think I tried ever other possibility. Thanks again for the help, Robert.
