带多数据提示flex混合 chart （附图）

如题： <?xml version="1.0" encoding="utf-8"?><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" minwidth="955" minheight="600" creationcomplete="init()"><layout><basiclayout></basiclayout></layout><declarations><!-- 将非可视元素（例如服务、值对象）放在此处 --><!--lineseries 样式 s2 outStyle s22 overStyle--><solidcolorstroke id="s22" color="0x364794" weight="3"></solidcolorstroke><solidcolorstroke id="s2" color="0xee6644" weight="3"></solidcolorstroke><!--show chart showdataeffect--><seriesslide id="show" duration="1000" direction="up"></seriesslide><!-- areachart边框颜色 --><solidcolorstroke id="ss1" color="yellow" weight="2"></solidcolorstroke><!-- areachart填充颜色 --><solidcolor id="sc1" color="yellow" alpha=".5"></solidcolor><radiobuttongroup id="rbtnGroup" itemclick="radioButtonClick(event)"></radiobuttongroup></declarations><style> @namespace s "library://ns.adobe.com/flex/spark"; @namespace mx "library://ns.adobe.com/flex/mx"; .ChineseFont{ fontFamily:"Verdana","宋体"; fontSize:12; fontWeight:normal; } </style> <script> year.height-80) label1.y = arr[i].y -25; else if(arr[i].y year.width - 200 ){ label1.x = arr[i].x; label1.rotationY = 180; label1.rotateY = 180; }else{ label1.x = arr[i].x; } if( i %3 == 0){ label1.tipsText = "交易量：" + arr[i].yValue; monthSeriesQuantily1.displayName = "交易量：" + arr[i].yValue; label1.ubackgroundcolor =colorArray[0]; }else if( i%3 ==1){ label1.tipsText = "交易额：" + arr[i].yValue; monthSeriesMoney1.displayName = "交易额：" + arr[i].yValue; label1.ubackgroundcolor = 0xee6644; }else{ label1.tipsText = "利润：" + arr[i].yValue; monthSeriesProfit1.displayName = "利润：" + arr[i].yValue; label1.ubackgroundcolor = 0xffd400; } lbtitle.x = arr[i&1].x; linesCanvas.addChild(label1); year.addChild(lbtitle); } linesCanvas.graphics.endFill(); } } //鼠标移出事件 private function outListener(event:MouseEvent):void{ year.removeChild(lbtitle); lbtitle = null; linesCanvas.graphics.clear() linesCanvas.removeAllChildren(); label1 = null; } //按选择日期重新获取数据 private function radioButtonClick(event:ItemClickEvent):void{ switch(event.currentTarget.selectedValue){ case "oneDay" : tipsWidth = 20; numDay = 1; break; case "threeDay" : tipsWidth = 20; numDay = 3; break; case "sevenDay" : tipsWidth = 20; numDay = 7; break; case "halfMonth" : tipsWidth = 20; numDay = 15; break; case "oneMonth" : tipsWidth = 5; var d:Date = new Date(); if(d.getDate() != getDaysOfMonth(d.getFullYear(),d.getMonth() +1) ) numDay = getDaysOfMonth(d.getFullYear(),d.getMonth()); else numDay = getDaysOfMonth(d.getFullYear(),d.getMonth() +1); break; } getData(numDay); } /* 获得给定年、月的天数 ((endDate.getMilliseconds() - startDate.getMilliseconds())/(1000 * 60 * 60 * 24))*/ private function getDaysOfMonth(year:int, month:int):Number { return(new Date(year,month,0).getDate()); } //lvaxis格式化 private function CMstoInches(ar:IAxisRenderer, strCMs:String):String { var n:CurrencyFormatter = new CurrencyFormatter(); return n.format(strCMs).toString() +"(元)"; } ]]> </script><label id="title" text="最近{numDay}天交易" width="200" height="50" y="25" fontsize="18" fontweight="bold" x="150"></label> <radiobutton id="oneDay" label="昨天" value="oneDay" groupname="rbtnGroup"></radiobutton><radiobutton x="80" id="threeDay" label="近三天" value="threeDay" groupname="rbtnGroup"></radiobutton><radiobutton x="160" id="sevenDay" label="近七天" selected value="sevenDay" groupname="rbtnGroup"></radiobutton><radiobutton x="240" id="halfMonth" label="近半个月" value="halfMonth" groupname="rbtnGroup"></radiobutton><radiobutton x="320" id="oneMonth" label="近一个月" value="oneMonth" groupname="rbtnGroup"></radiobutton><columnchart x="13" y="56" id="year" height="260" width="550" showdatatips="false" filters="[]" seriesfilters="[]" datatipmode="multiple" mousesensitivity="{year.height}"><annotationelements><canvas id="linesCanvas" horizontalscrollpolicy="off" verticalscrollpolicy="off"></canvas></annotationelements><horizontalaxis><categoryaxis id="hAxis" categoryfield="@title"></categoryaxis></horizontalaxis><horizontalaxisrenderers><axisrenderer axis="{hAxis}" id="hAxisRenderer" fontsize="12" buttonmode="true" focusrect="true" labelgap="0" usehandcursor="true"></axisrenderer></horizontalaxisrenderers><verticalaxis><!--设定左边Y轴坐标的数值范围 --><linearaxis id="vAxis1"></linearaxis></verticalaxis><verticalaxisrenderers><axisrenderer axis="{vAxis1}" placement="right" fontsize="12" labelfunction="CMstoInches"></axisrenderer><axisrenderer axis="{lvAxis}" placement="left" fontsize="12" highlightelements="true"></axisrenderer></verticalaxisrenderers><series><columnseries id="monthSeriesQuantily1" displayname="交易量" xfield="@title" yfield="@value" showdataeffect="{show}" itemrenderer="mx.charts.renderers.BoxItemRenderer"><verticalaxis><linearaxis id="lvAxis" maximum="50"></linearaxis></verticalaxis><fill><!-- 填充颜色 --><solidcolor color="{colorArray[0]}" alpha="1.0"></solidcolor></fill></columnseries><lineseries id="monthSeriesMoney1" displayname="交易额" xfield="@title" yfield="@value" showdataeffect="{show}" buttonmode="true" usehandcursor="true" linestroke="{s2}" form="segment" mouseover="lineMouseOver(event)" mouseout="lineMouseOut(event)"></lineseries><areaseries id="monthSeriesProfit1" displayname="利润" xfield="@title" alpha="0.5" yfield="@value" showdataeffect="{show}" areastroke="{ss1}" areafill="{sc1}"></areaseries></series></columnchart><legend id="ld" dataprovider="{year}" x="150" y="320" direction="horizontal" fontsize="14" legenditemclass="model.LinkLegendItem"></legend> </application> 见图：

评论

1 楼 qiyangyang09 2011-03-08  

晕，转帖不要钱啊。