charts.as

这是YUI的源码及相关示例。里面有很多很炫的Javascript效果。

		 * Sets the title displayed next to the horizontal axis.
		 */
		public function setHorizontalAxisTitle(value:String):void
		{
			var cartesianChart:CartesianChart = this.chart as CartesianChart;
			if(cartesianChart)
			{
				cartesianChart.horizontalAxisTitle = value;
			}
			else
			{
				var shortName:String = ChartSerializer.getShortName(getQualifiedClassName(this.chart));
				this.log("Unable to set horizontalAxisTitle on a chart of type " + shortName, LoggerCategory.WARN);
			}
		}
		
		/**
		 * Returns the title displayed next to the vertical axis.
		 */
		public function getVerticalAxisTitle():String
		{
			var cartesianChart:CartesianChart = this.chart as CartesianChart;
			if(cartesianChart)
			{
				return cartesianChart.verticalAxisTitle;
			}
			
			var shortName:String = ChartSerializer.getShortName(getQualifiedClassName(this.chart));
			this.log("Unable to find verticalAxisTitle on a chart of type " + shortName, LoggerCategory.WARN);
			return null;
		}
		
		/**
		 * Sets the title displayed next to the vertical axis.
		 */
		public function setVerticalAxisTitle(value:String):void
		{
			var cartesianChart:CartesianChart = this.chart as CartesianChart;
			if(cartesianChart)
			{
				cartesianChart.verticalAxisTitle = value;
			}
			else
			{
				var shortName:String = ChartSerializer.getShortName(getQualifiedClassName(this.chart));
				this.log("Unable to set verticalAxisTitle on a chart of type " + shortName, LoggerCategory.WARN);
			}
		}
		
		/**
		 * Updates the horizontal axis with a new type.
		 */
		public function setHorizontalAxis(value:Object):void
		{
			var cartesianChart:CartesianChart = this.chart as CartesianChart;
			if(cartesianChart)
			{
				cartesianChart.horizontalAxis = AxisSerializer.readAxis(value);
			}
			else
			{
				var shortName:String = ChartSerializer.getShortName(getQualifiedClassName(this.chart));
				this.log("Unable to set horizontalAxis on a chart of type " + shortName, LoggerCategory.WARN);
			}
		}
		
		/**
		 * Updates the vertical axis with a new type.
		 */
		public function setVerticalAxis(value:Object):void
		{
			var cartesianChart:CartesianChart = this.chart as CartesianChart;
			if(cartesianChart)
			{
				cartesianChart.verticalAxis = AxisSerializer.readAxis(value);
			}
			else
			{
				var shortName:String = ChartSerializer.getShortName(getQualifiedClassName(this.chart));
				this.log("Unable to set verticalAxis on a chart of type " + shortName, LoggerCategory.WARN);
			}
		}
		
		/**
		 * Sets the JavaScript function to call to generate the chart's data tip.
		 */
		public function setDataTipFunction(value:String):void
		{
			var delegate:Object = {dataTipFunction: JavaScriptUtil.createCallbackFunction(value).callback};
			delegate.callback = function(item:Object, index:int, series:ISeries):String
			{
				return delegate.dataTipFunction(item, index, SeriesSerializer.writeSeries(series));
			}
			
			this.chart.dataTipFunction = delegate.callback;
		}
		
		/**
		 * Accepts a JSON-encoded set of styles for the chart itself.
		 * Flash Player versions below 9.0.60 don't encode ExternalInterface
		 * calls correctly!
		 */
		public function setStyles(styles:String):void
		{
			if(!styles) return;
			var parsedStyles:Object = JSON.decode(styles);
			for(var styleName:String in parsedStyles)
			{
				this.setStyle(styleName, parsedStyles[styleName], false);
			}
		}
		
		public function setStyle(name:String, value:Object, json:Boolean = true):void
		{
			if(json && value)
			{
				//by default, we assume it's json data, only setStyles will send false
				value = JSON.decode(value as String);
			}
			
			var needsSizingRefresh:Boolean = false;
			
			switch(name)
			{
				case "padding":
					this.padding = value as Number;
					needsSizingRefresh = true;
					break;
				case "spacing":
					this.spacing = value as Number;
					needsSizingRefresh = true;
					break;
				case "animationEnabled":
					this.chart.setStyle("animationEnabled", value);
					break;
				case "border":
					if(value.color != null)
					{
						this.backgroundAndBorder.borderColor = this.parseColor(value.color);
					}
					
					if(value.size != null)
					{
						this.backgroundAndBorder.borderWeight = value.size;
						needsSizingRefresh = true;
					}
					break;
				case "background":
					if(value.color != null)
					{
						this.backgroundAndBorder.fillColor = this.parseColor(value.color);
					}
					
					if(value.image)
					{
						this.backgroundAndBorder.image = value.image;
					}
					
					if(value.alpha != null)
					{
						this.backgroundAndBorder.fillAlpha = value.alpha;
					}
					if(value.mode)
					{
						this.backgroundAndBorder.imageMode = value.mode;
					}
					break;
				case "font":
					var textFormat:TextFormat = TextFormatSerializer.readTextFormat(value);
					this.chart.setStyle("textFormat", textFormat);
					break;
				case "dataTip":
					this.setDataTipStyles(value);
					break;
				case "xAxis":
					this.setAxisStyles(value, "horizontal");
					break;
				case "yAxis":
					this.setAxisStyles(value, "vertical");
					break;
				case "legend":
					this.setLegendStyles(value);
					break;
				default:
					this.log("Unknown style: " + name, LoggerCategory.WARN);
			}
			
			if(needsSizingRefresh)
			{
				this.refreshComponentSize();
			}
		}
		
		public function setSeriesStyles(styles:Array):void
		{
			var defaultSeriesColors:Array =
					[0x00b8bf, 0x8dd5e7, 0xedff9f, 0xffa928, 0xc0fff6, 0xd00050,
					0xc6c6c6, 0xc3eafb, 0xfcffad, 0xcfff83, 0x444444, 0x4d95dd,
					0xb8ebff, 0x60558f, 0x737d7e, 0xa64d9a, 0x8e9a9b, 0x803e77];
					
			//will be filled based on the defaults or the series style definition, if present.
			var seriesColors:Array = [];
			var seriesCount:int = Math.min(this.chart.dataProvider.length, styles.length);
			for(var i:int = 0; i < seriesCount; i++)
			{
				var series:ISeries = ISeries(this.chart.dataProvider[i]);
				var style:Object = styles[i];
				if(style)
				{
					style = JSON.decode(style as String);
				}
				
				//defaults
				var defaultColors:Array = defaultSeriesColors.concat();
				if(series is PieSeries)
				{
					defaultColors = [defaultColors];
				}
				
				var defaultSize:Number = 10;
				if(series is ColumnSeries || series is BarSeries)
				{
					defaultSize = 20;
				}
				
				var defaultSkin:Object = RectangleSkin;
				if(series is LineSeries)
				{
					defaultSkin = CircleSkin;
				}
				else if(series is PieSeries)
				{
					defaultSkin = [defaultSkin];
				}
			
				//initialize styles with defaults
				var color:Object = defaultColors[i % defaultColors.length];
				var skin:Object = defaultSkin;
				var mode:Object = "repeat";
				if(style)
				{
					for(var styleName:String in style)
					{
						switch(styleName)
						{
							case "images":
								if(!(series is PieSeries))
								{
									this.log(styleName + " style is only supported by series of type 'pie'.", LoggerCategory.WARN);
									break;
								}
								var images:Array = style.images as Array;
								var imageCount:int = images.length;
								for(var j:int = 0; j < imageCount; j++)
								{
									images[j] = this.createMarkerSkin(String(images[j]), series);
								}
								skin = images;
								break;
							case "image":
								skin = this.createMarkerSkin(style.image, series);
								if(!(series is LineSeries))
								{
									skin.properties.fillColor = color;
									skin.properties.fillAlpha = 1;
								}
								break;
							case "mode":
								mode = style.mode;
								break;
							case "colors":
								if(!(series is PieSeries))
								{
									this.log(styleName + " style is only supported by series of type 'pie'.", LoggerCategory.WARN);
									break;
								}
								var colors:Array = style.colors;
								var colorCount:int = colors.length;
								for(j = 0; j < colorCount; j++)
								{
									colors[j] = this.parseColor(colors[j]);
								}
								color = colors;
								break;
							case "color":
								color = this.parseColor(style.color);
								if(skin is InstanceFactory && !(series is LineSeries))
								{
									skin.properties.fillColor = color;
									skin.properties.fillAlpha = 1;
								}
								break;
							case "size":
								UIComponent(series).setStyle("markerSize", style.size);
								break;
							case "alpha":
								UIComponent(series).setStyle("markerAlpha", style.alpha);
								break;
							case "showAreaFill": //LineSeries only
								if(!(series is LineSeries))
								{
									this.log("The style " + styleName + " is only supported by series of type 'line'.", LoggerCategory.WARN);
								}
								UIComponent(series).setStyle("showAreaFill", style.showAreaFill);
								break;
							case "areaFillAlpha": //LineSeries only
								if(!(series is LineSeries))
								{
									this.log("The style " + styleName + " is only supported by series of type 'line'.", LoggerCategory.WARN);
								}
								UIComponent(series).setStyle("areaFillAlpha", style.areaFillAlpha);
								break;
							case "lineSize": //LineSeries only
								if(!(series is LineSeries))
								{
									this.log("The style " + styleName + " is only supported by series of type 'line'.", LoggerCategory.WARN);
								}
								UIComponent(series).setStyle("lineWeight", style.lineSize);
								break;
							case "connectPoints": //LineSeries only
								if(!(series is LineSeries))
								{
									this.log("The style " + styleName + " is only supported by series of type 'line'.", LoggerCategory.WARN);
								}
								UIComponent(series).setStyle("connectPoints", style.connectPoints);
								break;
							case "connectDiscontinuousPoints": //LineSeries only
								if(!(series is LineSeries))
								{
									this.log("The style " + styleName + " is only supported by series of type 'line'.", LoggerCategory.WARN);
								}
								UIComponent(series).setStyle("connectDiscontinuousPoints", style.connectDiscontinuousPoints);
								break;
							case "discontinuousDashLength": //LineSeries only
								if(!(series is LineSeries))
								{
									this.log("The style " + styleName + " is only supported by series of type 'line'.", LoggerCategory.WARN);
								}
								UIComponent(series).setStyle("discontinuousDashLength", style.discontinuousDashLength);
								break;
							case "showLabels": //PieSeries only
								if(!(series is PieSeries))
								{
									this.log("The style " + styleName + " is only supported by series of type 'pie'.", LoggerCategory.WARN);
								}
								UIComponent(series).setStyle("showLabels", style.showLabels);
								break;
							case "hideOverlappingLabels": //PieSeries only
								if(!(series is PieSeries))
								{
									this.log("The style " + styleName + " is only supported by series of type 'pie'.", LoggerCategory.WARN);
								}
								UIComponent(series).setStyle("hideOverlappingLabels", style.showLabels);
								break;
							case "font": //PieSeries only
								if(!(series is PieSeries))
								{
									this.log("The style " + styleName + " is only supported by series of type 'pie'.", LoggerCategory.WARN);
								}
								UIComponent(series).setStyle("textFormat", TextFormatSerializer.readTextFormat(style.font))
								break;
							default:
								this.log("Unknown series style: " + styleName, LoggerCategory.WARN);
						}
					}
				}
				if(mode)
				{
					if(skin is InstanceFactory)
					{
						skin.properties.imageMode = mode;
					}
					else if(skin is Array)
					{
						var skinCount:int = (skin as Array).length;
						for(j = 0; j < skinCount; j++)
						{
							var subSkin:InstanceFactory = skin[j] as InstanceFactory;
							if(subSkin)
							{
								subSkin.properties.imageMode = mode;
							}
						}
					}
				}
				
				if(series is PieSeries)
				{
					PieSeries(series).setStyle("markerSkins", skin);
				}
				else UIComponent(series).setStyle("markerSkin", skin);
				
				seriesColors[i] = color;
			}
			this.chart.setStyle("seriesColors", seriesColors);

			this.chart.drawNow();
		}
		
	//--------------------------------------
	//  Protected Methods
	//--------------------------------------
		
		/**
		 * @private (protected)
		 * Initialize the functions that may be called by JavaScript through ExternalInterface.
		 */
		override protected function initializeComponent():void
		{
			super.initializeComponent();
			
			try
			{
				ExternalInterface.addCallback("setType", setType);
				ExternalInterface.addCallback("setStyle", setStyle);
				ExternalInterface.addCallback("setStyles", setStyles);
				ExternalInterface.addCallback("setSeriesStyles", setSeriesStyles);
				ExternalInterface.addCallback("setDataProvider", setDataProvider);
				ExternalInterface.addCallback("getCategoryNames", getCategoryNames);
				ExternalInterface.addCallback("setCategoryNames", setCategoryNames);
				ExternalInterface.addCallback("setDataTipFunction", setDataTipFunction);
				ExternalInterface.addCallback("getCategoryNames", getCategoryNames);
				ExternalInterface.addCallback("setCategoryNames", setCategoryNames);
				
				//CartesianChart
				ExternalInterface.addCallback("getHorizontalField", getHorizontalField);
				ExternalInterface.addCallback("setHorizontalField", setHorizontalField);
				ExternalInterface.addCallback("getVerticalField", getVerticalField);
				ExternalInterface.addCallback("setVerticalField", setVerticalField);
				ExternalInterface.addCallback("setHorizontalAxis", setHorizontalAxis);
				ExternalInterface.addCallback("setVerticalAxis", setVerticalAxis);
				
				//PieChart
				ExternalInterface.addCallback("getDataField", getDataField);
				ExternalInterface.addCallback("setDataField", setDataField);
				ExternalInterface.addCallback("getCategoryField", getCategoryField);
				ExternalInterface.addCallback("setCategoryField", setCategoryField);
			}
			catch(error:SecurityError)
			{
				//do nothing. it will be caught by the YUIAdapter.
			}

			this.backgroundAndBorder = new BackgroundAndBorder();
			this.backgroundAndBorder.width = this.stage.stageWidth;
			this.backgroundAndBorder.height = this.stage.stageHeight;
			this.backgroundAndBorder.addEventListener(ErrorEvent.ERROR, backgroundErrorHandler);
			this.addChild(this.backgroundAndBorder);
			
			this.legend = new Legend();
			this.legend.setStyle("backgroundSkin", Shape);
			this.addChild(this.legend);