一个LineChart例子

最新推荐文章于 2020-12-17 14:30:38 发布

~纹之心

最新推荐文章于 2020-12-17 14:30:38 发布

阅读量154

点赞数

分类专栏： flash她妹flex 文章标签： XML

本文链接：https://blog.csdn.net/ynp507/article/details/83633292

版权

flash她妹flex 专栏收录该内容

37 篇文章 0 订阅

订阅专栏

<?xml version="1.0"?>
<!-- Simple example to demonstrate the HLOCChart control. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init()">
    <mx:Script>
        <![CDATA[          
        import mx.collections.ArrayCollection;

        private var stockDataAC:ArrayCollection = new ArrayCollection( [
            { Date: "25-Jul", Open: 40.55,  High: 40.75, Low: 40.24, Close:40.31},
            { Date: "26-Jul", Open: 40.15,  High: 40.78, Low: 39.97, Close:40.34},
            { Date: "27-Jul", Open: 40.38,  High: 40.66, Low: 40, Close:40.63},
            { Date: "28-Jul", Open: 40.49,  High: 40.99, Low: 40.3, Close:40.98},
            { Date: "29-Jul", Open: 40.13,  High: 40.4, Low: 39.65, Close:39.95},
            { Date: "1-Aug", Open: 39.00,  High: 39.50, Low: 38.7, Close:38.6}, 
            { Date: "2-Aug", Open: 38.68,  High: 39.34, Low: 37.75, Close:38.84}, 
            { Date: "3-Aug", Open: 38.76,  High: 38.76, Low: 38.03, Close:38.12}, 
            { Date: "4-Aug", Open: 37.98,  High: 37.98, Low: 36.56, Close:36.69},                       
            { Date: "5-Aug", Open: 36.61,  High: 37, Low: 36.48, Close:36.86},

            { Date: "25-Jul", Open: 40.55,  High: 40.75, Low: 40.24, Close:40.31},
            { Date: "26-Jul", Open: 40.15,  High: 40.78, Low: 39.97, Close:40.34},
            { Date: "27-Jul", Open: 40.38,  High: 40.66, Low: 40, Close:40.63},
            { Date: "28-Jul", Open: 40.49,  High: 40.99, Low: 40.3, Close:40.98},
            { Date: "29-Jul", Open: 40.13,  High: 40.4, Low: 39.65, Close:39.95},
            { Date: "1-Aug", Open: 39.00,  High: 39.50, Low: 38.7, Close:38.6}, 
            { Date: "2-Aug", Open: 38.68,  High: 39.34, Low: 37.75, Close:38.84}, 
            { Date: "3-Aug", Open: 38.76,  High: 38.76, Low: 38.03, Close:38.12}, 
            { Date: "4-Aug", Open: 37.98,  High: 37.98, Low: 36.56, Close:36.69},                       
            { Date: "5-Aug", Open: 36.61,  High: 37, Low: 36.48, Close:36.86} ]); 

           	[Bindable] 
            private var tempstockDataAC:ArrayCollection ;
            [Bindable] 
            private var dataLength:int;

            private function init():void{
            	tempstockDataAC = new ArrayCollection(stockDataAC.source);
            	dataLength = stockDataAC.length-1;
            	slider.values[1] = dataLength;
            }

            private function rangeChange():void{
            	if(stockDataAC != null && stockDataAC.length!=0){
	            	var tempNum:Number = slider.value;
	            	tempstockDataAC.source = stockDataAC.toArray().slice(slider.values[0],slider.values[1]+1);
            	}
            }

            private function getSliderLabel(value:String):String{
	            return stockDataAC[parseInt(value)].Date;
        	}    
        ]]>
    </mx:Script>

	<mx:LineChart id="lineChart" styleName="lineChart"  showDataTips="true" dataProvider="{tempstockDataAC}" fontSize="12" width="952.5" height="260" y="40" x="17.5" selectionMode="single">
		<!--网格-->
		<mx:backgroundElements> 
            <mx:GridLines id="gridLines" direction="both"> 
                <mx:horizontalStroke> 
                    <mx:Stroke color="black" weight="0" alpha="1.0" /> 
                </mx:horizontalStroke> 
                <mx:verticalFill> 
                    <mx:SolidColor color="haloBlue" alpha="0.2" /> 
                </mx:verticalFill> 
<!--                <mx:verticalAlternateFill> 
                    <mx:SolidColor color="haloSilver" alpha="0.2" /> 
                </mx:verticalAlternateFill> -->
            </mx:GridLines> 
        </mx:backgroundElements> 
        <!--纵坐标-->
		<mx:verticalAxis>
			<mx:LinearAxis baseAtZero="false"  minimum="{35}" maximum="{42}" interval="{1}" minorInterval="{0.2}" title="监测值" /> <!-- baseAtZero 是否从0显示；实际应用最好去掉minimum="{35}" maximum="{42}"，自动设定最大最小值；-->
		</mx:verticalAxis>
		<!--横坐标-->
   		<mx:horizontalAxis>
            <mx:CategoryAxis id="haxis" categoryField="Date" title="日期" />
         </mx:horizontalAxis>
		<mx:series>
			<mx:LineSeries yField="Open" displayName="数据" form="segment"><!--form显示曲线样式-->
				<mx:lineStroke>
					<mx:Stroke color="haloGreen" weight="10"/> <!--设置曲线宽度和颜色-->
				</mx:lineStroke>
			</mx:LineSeries>
		</mx:series>

       <mx:horizontalAxisRenderers> 
            <mx:AxisRenderer axis="{haxis}" 
                    canDropLabels="true" /> 
        </mx:horizontalAxisRenderers> 	

<!--		<mx:seriesFilters>
			<mx:Array />
		</mx:seriesFilters>-->
	</mx:LineChart>

	<mx:ControlBar> <!--图例-->
		<mx:Legend id="legend" dataProvider="{lineChart}" alpha="0.5"/>	
	</mx:ControlBar>
    <mx:HSlider id="slider" width="150" thumbCount="2" snapInterval="1" minimum="5" maximum="{dataLength}"
    	dataTipFormatFunction="getSliderLabel"
    	change="rangeChange()"/>
</mx:Application>