Solved! Go to Solution.
<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:esri="http://www.esri.com/2008/ags" xmlns:s="library://ns.adobe.com/flex/spark" pageTitle="Earthquakes 1970-2009"> <!-- esri dev. team sample http://resources.arcgis.com/en/help/flex-api/samples/01nq/01nq0000001m000000.htm --> <s:layout> <s:VerticalLayout horizontalAlign="center" paddingBottom="10" paddingTop="10"/> </s:layout> <fx:Style> @namespace mx "library://ns.adobe.com/flex/mx"; @namespace esri "http://www.esri.com/2008/ags"; @namespace s "library://ns.adobe.com/flex/spark"; /* for the slider tooltip that shows the date as you move the slider */ mx|ToolTip { font-size: 14; } </fx:Style> <fx:Script> <![CDATA[ import com.esri.ags.events.LayerEvent; import com.esri.ags.layers.supportClasses.TimeInfo; import mx.controls.Alert; import mx.core.IVisualElement; import mx.utils.StringUtil; import spark.globalization.supportClasses.GlobalizationBase; protected function fLayer_loadHandler(event:LayerEvent):void { var timeInfo:TimeInfo = fLayer.layerDetails.timeInfo; myTimeSlider.createTimeStopsByTimeInterval(timeInfo.timeExtent, timeInfo.timeInterval, timeInfo.timeIntervalUnits); myTimeSlider.play(); // start playing automatically } protected function onGetInfo1(event:MouseEvent):void { var ts:TimeSlider = esriMap.timeSlider as TimeSlider; if (ts != null) { var message:String = StringUtil.substitute("Id: {0}\nVisible: {1}\nNumber of stops: {2}\n...", ts.id, ts.enabled, ts.timeStops.length); Alert.show(message, "TimeSlider info from map"); } } protected function onGetInfo2(event:MouseEvent):void { var message:String = StringUtil.substitute("Is playing now: {0}\nVisible: {1}\nNumber of stops: {2}\n...", myTimeSlider.playing, myTimeSlider.enabled, myTimeSlider.timeStops.length); Alert.show(message, "Direct TimeSlider info"); } protected function onGetInfo3(event:MouseEvent):void { var ts:TimeSlider; for (var i:int; i < numElements-1; i++) { try { var element:IVisualElement = this.getElementAt(i) if (element is TimeSlider) { ts = element as TimeSlider; break; } } catch (error:Error) { trace(error.getStackTrace()); } } if (ts != null) { var message:String = StringUtil.substitute("Is playing now: {0}\nVisible: {1}\nNumber of stops: {2}\nId: {3}\n...", ts.playing, myTimeSlider.enabled, myTimeSlider.timeStops.length, ts.id); Alert.show(message, "TimeSlider info from application"); } } ]]> </fx:Script> <fx:Declarations> <!-- http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/globalization/DateTimeFormatter.html#setDateTimePattern() --> <s:DateTimeFormatter id="myDateFormatter" dateTimePattern="MMMM yyyy"/> </fx:Declarations> <s:Label fontSize="20" text="Major Earthquakes 1970-2009"/> <s:Label fontSize="13" text="In total {fLayer.numGraphics} earthquakes." visible="{fLayer.numGraphics > 0}"/> <s:Button label="Get information about time slider from map" click="onGetInfo1(event)"/> <s:Button label="Get information about time slider from application" click="onGetInfo3(event)"/> <s:Button label="Get information about time slider directly" click="onGetInfo2(event)"/> <esri:Map id="esriMap" timeSlider="{myTimeSlider}"> <esri:lods> <esri:LOD resolution="39135.7584820001" scale="147914381.897889"/> <esri:LOD resolution="19567.8792409999" scale="73957190.948944"/> <esri:LOD resolution="9783.93962049996" scale="36978595.474472"/> <esri:LOD resolution="4891.96981024998" scale="18489297.737236"/> <esri:LOD resolution="2445.98490512499" scale="9244648.868618"/> <esri:LOD resolution="1222.99245256249" scale="4622324.434309"/> <esri:LOD resolution="611.49622628138" scale="2311162.217155"/> </esri:lods> <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer"/> <esri:FeatureLayer id="fLayer" load="fLayer_loadHandler(event)" mode="snapshot" outFields="[Magnitude]" url="http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Earthquakes/Since_1970/MapServer/0"> <esri:renderer> <esri:ClassBreaksRenderer field="Magnitude"> <esri:ClassBreakInfo maxValue="5"> <esri:symbol> <esri:SimpleMarkerSymbol alpha="0.8" color="0xFF0000" size="8" style="triangle"> <esri:SimpleLineSymbol color="0xAA0000"/> </esri:SimpleMarkerSymbol> </esri:symbol> </esri:ClassBreakInfo> <esri:ClassBreakInfo maxValue="7" minValue="5"> <esri:symbol> <esri:SimpleMarkerSymbol alpha="0.8" color="0xFF0000" size="12" style="triangle"> <esri:SimpleLineSymbol color="0xAA0000"/> </esri:SimpleMarkerSymbol> </esri:symbol> </esri:ClassBreakInfo> <esri:ClassBreakInfo minValue="7"> <esri:symbol> <esri:SimpleMarkerSymbol alpha="0.8" color="0xFF0000" size="25" style="triangle"> <esri:SimpleLineSymbol color="0xAA0000"/> </esri:SimpleMarkerSymbol> </esri:symbol> </esri:ClassBreakInfo> </esri:ClassBreaksRenderer> </esri:renderer> </esri:FeatureLayer> </esri:Map> <esri:TimeSlider id="myTimeSlider" enabled="{fLayer.loaded}"/> <s:Label fontSize="14" fontWeight="bold" text="{myDateFormatter.format(myTimeSlider.timeExtent.endTime)}"/> <s:Label width="100%" text="This map has one time-aware layer: a feature layer showing earthquakes, which on the client are rendered as triangles of different sizes based on the 'magnitude' of the feature."/> </s:Application>
<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:esri="http://www.esri.com/2008/ags" xmlns:s="library://ns.adobe.com/flex/spark" pageTitle="Earthquakes 1970-2009"> <!-- esri dev. team sample http://resources.arcgis.com/en/help/flex-api/samples/01nq/01nq0000001m000000.htm --> <s:layout> <s:VerticalLayout horizontalAlign="center" paddingBottom="10" paddingTop="10"/> </s:layout> <fx:Style> @namespace mx "library://ns.adobe.com/flex/mx"; @namespace esri "http://www.esri.com/2008/ags"; @namespace s "library://ns.adobe.com/flex/spark"; /* for the slider tooltip that shows the date as you move the slider */ mx|ToolTip { font-size: 14; } </fx:Style> <fx:Script> <![CDATA[ import com.esri.ags.events.LayerEvent; import com.esri.ags.layers.supportClasses.TimeInfo; import mx.controls.Alert; import mx.core.IVisualElement; import mx.utils.StringUtil; import spark.globalization.supportClasses.GlobalizationBase; protected function fLayer_loadHandler(event:LayerEvent):void { var timeInfo:TimeInfo = fLayer.layerDetails.timeInfo; myTimeSlider.createTimeStopsByTimeInterval(timeInfo.timeExtent, timeInfo.timeInterval, timeInfo.timeIntervalUnits); myTimeSlider.play(); // start playing automatically } protected function onGetInfo1(event:MouseEvent):void { var ts:TimeSlider = esriMap.timeSlider as TimeSlider; if (ts != null) { var message:String = StringUtil.substitute("Id: {0}\nVisible: {1}\nNumber of stops: {2}\n...", ts.id, ts.enabled, ts.timeStops.length); Alert.show(message, "TimeSlider info from map"); } } protected function onGetInfo2(event:MouseEvent):void { var message:String = StringUtil.substitute("Is playing now: {0}\nVisible: {1}\nNumber of stops: {2}\n...", myTimeSlider.playing, myTimeSlider.enabled, myTimeSlider.timeStops.length); Alert.show(message, "Direct TimeSlider info"); } protected function onGetInfo3(event:MouseEvent):void { var ts:TimeSlider; for (var i:int; i < numElements-1; i++) { try { var element:IVisualElement = this.getElementAt(i) if (element is TimeSlider) { ts = element as TimeSlider; break; } } catch (error:Error) { trace(error.getStackTrace()); } } if (ts != null) { var message:String = StringUtil.substitute("Is playing now: {0}\nVisible: {1}\nNumber of stops: {2}\nId: {3}\n...", ts.playing, myTimeSlider.enabled, myTimeSlider.timeStops.length, ts.id); Alert.show(message, "TimeSlider info from application"); } } ]]> </fx:Script> <fx:Declarations> <!-- http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/globalization/DateTimeFormatter.html#setDateTimePattern() --> <s:DateTimeFormatter id="myDateFormatter" dateTimePattern="MMMM yyyy"/> </fx:Declarations> <s:Label fontSize="20" text="Major Earthquakes 1970-2009"/> <s:Label fontSize="13" text="In total {fLayer.numGraphics} earthquakes." visible="{fLayer.numGraphics > 0}"/> <s:Button label="Get information about time slider from map" click="onGetInfo1(event)"/> <s:Button label="Get information about time slider from application" click="onGetInfo3(event)"/> <s:Button label="Get information about time slider directly" click="onGetInfo2(event)"/> <esri:Map id="esriMap" timeSlider="{myTimeSlider}"> <esri:lods> <esri:LOD resolution="39135.7584820001" scale="147914381.897889"/> <esri:LOD resolution="19567.8792409999" scale="73957190.948944"/> <esri:LOD resolution="9783.93962049996" scale="36978595.474472"/> <esri:LOD resolution="4891.96981024998" scale="18489297.737236"/> <esri:LOD resolution="2445.98490512499" scale="9244648.868618"/> <esri:LOD resolution="1222.99245256249" scale="4622324.434309"/> <esri:LOD resolution="611.49622628138" scale="2311162.217155"/> </esri:lods> <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer"/> <esri:FeatureLayer id="fLayer" load="fLayer_loadHandler(event)" mode="snapshot" outFields="[Magnitude]" url="http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Earthquakes/Since_1970/MapServer/0"> <esri:renderer> <esri:ClassBreaksRenderer field="Magnitude"> <esri:ClassBreakInfo maxValue="5"> <esri:symbol> <esri:SimpleMarkerSymbol alpha="0.8" color="0xFF0000" size="8" style="triangle"> <esri:SimpleLineSymbol color="0xAA0000"/> </esri:SimpleMarkerSymbol> </esri:symbol> </esri:ClassBreakInfo> <esri:ClassBreakInfo maxValue="7" minValue="5"> <esri:symbol> <esri:SimpleMarkerSymbol alpha="0.8" color="0xFF0000" size="12" style="triangle"> <esri:SimpleLineSymbol color="0xAA0000"/> </esri:SimpleMarkerSymbol> </esri:symbol> </esri:ClassBreakInfo> <esri:ClassBreakInfo minValue="7"> <esri:symbol> <esri:SimpleMarkerSymbol alpha="0.8" color="0xFF0000" size="25" style="triangle"> <esri:SimpleLineSymbol color="0xAA0000"/> </esri:SimpleMarkerSymbol> </esri:symbol> </esri:ClassBreakInfo> </esri:ClassBreaksRenderer> </esri:renderer> </esri:FeatureLayer> </esri:Map> <esri:TimeSlider id="myTimeSlider" enabled="{fLayer.loaded}"/> <s:Label fontSize="14" fontWeight="bold" text="{myDateFormatter.format(myTimeSlider.timeExtent.endTime)}"/> <s:Label width="100%" text="This map has one time-aware layer: a feature layer showing earthquakes, which on the client are rendered as triangles of different sizes based on the 'magnitude' of the feature."/> </s:Application>