关于LineChart中，如何实现这样的功能

vfan2010 2009-07-02 01:50:33

<AllActionItems>

  <ActionItem>

    <ActionItemID>1</ActionItemID>

    <Title>Test Action Item</Title>

    <Actions>

        <CurrentAction>

            <DateString>01/02/2009</DateString>

            <HourIndex>4</HourIndex>

                    <ActionString>

            ttt

                    </ActionString>

        </CurrentAction>

        <CurrentAction>

            <DateString>01/04/2009</DateString>

            <HourIndex>6</HourIndex>

                <ActionString>

                     sss

                </ActionString>

        </CurrentAction>

     </Actions>

  </ActionItem>

  <ActionItem>

    <ActionItemID>2</ActionItemID>

    <Title>Test Action Item2222</Title>

    <Actions>

        <CurrentAction>

            <DateString>01/03/2009</DateString>

            <HourIndex>2</HourIndex>

                    <ActionString>

                          dd</ActionString>

        </CurrentAction>

        <CurrentAction>

            <DateString>01/04/2009</DateString>

            <HourIndex>8</HourIndex>

                <ActionString>

                     dfasdf                </ActionString>

        </CurrentAction>

     </Actions>

  </ActionItem>

</AllActionItems>

LineSeries的数量是根据上面的XML动态变化的，
有多少个ActionItem就有多少条线,也就是LineSeries，然后每一条线上面的数据源来自于子元素CurrentAction，
例如有两个CurrentAction, 则线上有两个点，然后第个点的ToolTip是ActionString，YField是HourIndex，x轴上面也就是DateString。

请问如何实现。不知道能不能一个个的添加LineSeries，然后再一个点的添加。
请大家尽量提供一些有用的信息

...全文

777 8 打赏收藏转发到动态举报

写回复

用AI写文章

8 条回复

切换为时间正序

请发表友善的回复…

发表回复

oC_Co 2010-08-11

打赏
举报

Line是一个LineSeries对象
实现了Line.setStyle("itemRenderer", new ClassFactory(CircleItemRenderer));

oC_Co 2010-08-10

打赏
举报

圆点你实现了吗？公布下

carlkwok 2010-01-15

打赏
举报

好像是itemRender应该写成itemRenderer ,我引用自己定itemrenderer类的时候报下面的错误.
哥们帮忙看怎么回事,你是怎么解决的
强制转换类型失败:无法将 mx.charts.chartClasses::LegendData@13572641 转换为 mx.charts.ChartItem。

carlkwok 2010-01-15

打赏
举报

line.setStyle("itemRender",new ClassFactory(LineRenderer));

请教朋友这个你实现了嘛

Sunlihgt_love 2009-07-22

打赏
举报

[Quote=引用 2 楼 wht6411 的回复:]
已经实现了。

不过现在有另外一个问题，就是我希望每个数据点以圆点的形式显示出来，用下面的代码怎么没有效果，Line是一个LineSeries对象，动态添加的时候定义的
line.setStyle("stroke",new Stroke(0xaaaaaa,0.8,0.7));
line.setStyle("radius",5);
line.setStyle("itemRender",new ClassFactory(LineRenderer));
[/Quote]
我也遇到同样的问题，请问你是怎样实现动态加入LineSeries的
可以发个例子到我的邮箱吗？
Sunlight_love@hotmail.com
谢谢

vfan2010 2009-07-03

打赏
举报

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" height="100%" applicationComplete="GetIssueData1();">

 

<mx:Script>

	<![CDATA[

		import mx.graphics.Stroke;

		import mx.charts.renderers.CircleItemRenderer;

	    import mx.charts.HitData;

		import mx.charts.LinearAxis;

		import mx.charts.CategoryAxis;

		import mx.utils.StringUtil;

		import mx.collections.ArrayCollection;

		import mx.charts.series.items.LineSeriesSegment;

		import mx.collections.XMLListCollection;

		import mx.controls.Alert;

		import mx.charts.series.LineSeries;

		import mx.charts.chartClasses.DataTransform; 

		import mx.charts.chartClasses.CartesianTransform;

		import mx.charts.series.items.LineSeriesItem;

	public var HourList:Array =[];

	

private function GetTimeAsIndex(item:Object,pre:Object,ax:LinearAxis):String

    {

    	var index:int;

    	index = Number(item);

        var str:String = "";

        if (index < 12)

        {

            str = index + ":00am";

        }

        else if (index >= 12)

        {

            str = (index - 12) + ":00pm";

        }

       if(str=="0:00am")

       	str = "12:00am";

       else if(str=="0:00pm")

       	str = "12:00pm";

        return str;

    }

	private function bindData():void

	{

				var url:String = ExternalInterface.call("SendUrlToFlex");				

				if(url.indexOf("?")!=-1)

					url +="&";

				else url +="?";

				this.hsGetData.url=url+"IssueID=0&tmp="+Math.random();

				this.hsGetData.send();

				

	}

private function GetIssueData1():void

{

		var xml:XML =  <AllData>

 <AllDates>

  <Date>06/25/2009</Date> 

  <Date>06/26/2009</Date> 

  <Date>06/27/2009</Date> 

  <Date>06/28/2009</Date> 

  <Date>06/29/2009</Date> 

  <Date>06/30/2009</Date> 

  <Date>07/01/2009</Date> 

  <Date>07/02/2009</Date> 

  <Date>07/03/2009</Date> 

  <Date>07/04/2009</Date> 

  <Date>07/05/2009</Date> 

  <Date>07/06/2009</Date> 

  <Date>07/07/2009</Date> 

  </AllDates>

 <AllActionItems>

 <ActionItem>

  <ActionItemID>6</ActionItemID> 

  <Title>Create an Action Item</Title> 

  </ActionItem>

 <ActionItem>

  <ActionItemID>15</ActionItemID> 

  <Title>tes</Title> 

  </ActionItem>

 <ActionItem>

  <ActionItemID>16</ActionItemID> 

  <Title>ActionItem</Title> 

  </ActionItem>

  </AllActionItems>

 <AllActions>

 <Action>

  <ActionItemID>6</ActionItemID> 

  <ActionDate>06/29/2009</ActionDate> 

  <HourIndex>9</HourIndex> 

  <Content><i>9:00am</i><BR/>This action item is assigned to Rick Shi .</Content> 

  </Action>

 <Action>

  <ActionItemID>16</ActionItemID> 

  <ActionDate>06/25/2009</ActionDate> 

  <HourIndex>8</HourIndex> 

  <Content><i>8:00am</i><BR/>test</Content> 

  </Action>

 <Action>

  <ActionItemID>16</ActionItemID> 

  <ActionDate>06/29/2009</ActionDate> 

  <HourIndex>6</HourIndex> 

  <Content><i>6:00am</i><BR/>This action item is assigned to Denise Speidel .</Content> 

  </Action>

 <Action>

  <ActionItemID>16</ActionItemID> 

  <ActionDate>07/01/2009</ActionDate> 

  <HourIndex>7</HourIndex> 

  <Content><i>7:00am</i><BR/>sdf</Content> 

  </Action>

  </AllActions>

  </AllData>;

		var dateList:XMLList =xml.AllDates.elements();

		var actionList:XMLList = xml.AllActions.elements();

		var actionItemList:XMLList = xml.AllActionItems.elements();

		var dataSource:Array = new Array();

		var o:Object;

		var dString:String,actionItemID:String,hourIndex:int,content:String,title:String;

		var searchList:XMLList;

		for each(var d:XML in dateList)

		{

			o = new Object();

			dString = d[0].toString();

			o["DateString"]=dString;

			searchList = xml..Action.(ActionDate==dString)



			for each(var a:XML in searchList)

			{

				actionItemID = a.ActionItemID;

				hourIndex = a.HourIndex;

				content = a.Content;

				o["a"+actionItemID] = hourIndex;

			    o["content"+actionItemID] = content;

				

			}

			dataSource.push(o);	

		}

		MainChart.dataProvider = dataSource;

		for each(var actionItem:XML in actionItemList)

		{

			actionItemID = actionItem.ActionItemID;

			title = actionItem.Title;

			var line:LineSeries = new LineSeries();			

	

			line.xField="DateString";

			line.interpolateValues = true;

 

			//line.setStyle("stroke",new Stroke(0xaaaaaa,1,0.7));

			line.setStyle("radius",5);

			line.radius=5;

 			line.yField = "a"+actionItemID;

			line.displayName =title;

			line.setStyle("itemRender",new ClassFactory(CircleItemRenderer));





			MainChart.series.push(line);

		}

		MainChart.series = MainChart.series;

 

		

}



public function SetDataTip(hd:HitData):String

{

   var dt:String = "";

         var this_series:LineSeries = LineSeries(hd.element);

         var dataTransform:DataTransform = this_series.dataTransform;

         var vertical_axis:LinearAxis = LinearAxis(dataTransform.getAxis(CartesianTransform.VERTICAL_AXIS));

         var horizontal_axis:CategoryAxis = CategoryAxis(dataTransform.getAxis(CartesianTransform.HORIZONTAL_AXIS));

         

         var actionItemID:String = this_series.yField;//a16

         actionItemID = actionItemID.substring(1,actionItemID.length);

         var content:String = hd.chartItem.item["content"+actionItemID].toString();

         var n:String = this_series.displayName;

         if (n && n != "")

         dt += "<b>" + n + "</b><BR/>";

        

         var xValue:Object = horizontal_axis.formatForScreen(LineSeriesItem(hd.chartItem).xValue);

         if(horizontal_axis.labelFunction != null)

             {

                 dt += horizontal_axis.labelFunction(xValue,{},horizontal_axis,LineSeriesItem(hd.chartItem)) + "<BR/>";    

             }

         else

             {

                 dt += xValue+ "<BR/>";    

             }

             dt += content+"\n";        

        

         return dt;	

}



	]]>

</mx:Script>

<mx:HTTPService id="hsGetData" result="GetIssueData1();" resultFormat="e4x">

	

</mx:HTTPService>



	    <mx:Panel title="Schedule chart for the issue" height="100%" width="100%" layout="vertical">

	    <mx:LineChart id="MainChart"  height="100%" width="100%"

	     showDataTips="true" paddingLeft="5" paddingRight="5"  dataTipFunction="SetDataTip"  >

 

	    	<mx:horizontalAxis>

	    		<mx:CategoryAxis categoryField="DateString">	    			

	    		</mx:CategoryAxis>

	    	</mx:horizontalAxis>

	    	<mx:verticalAxis>

	    		<mx:LinearAxis displayName="Hour" minimum="0" maximum="23" labelFunction="GetTimeAsIndex">	    			

	    		</mx:LinearAxis>

	    	</mx:verticalAxis>

	    </mx:LineChart>

		<mx:Legend   id="L1" dataProvider="{MainChart}">	

		</mx:Legend>

        </mx:Panel>

</mx:Application>

上面就是源代码，可以运行。因为本来是搜索数据库的，为了方便直接定义了XML

vfan2010 2009-07-03

打赏
举报

已经实现了。

不过现在有另外一个问题，就是我希望每个数据点以圆点的形式显示出来，用下面的代码怎么没有效果，Line是一个LineSeries对象，动态添加的时候定义的
line.setStyle("stroke",new Stroke(0xaaaaaa,0.8,0.7));
line.setStyle("radius",5);
line.setStyle("itemRender",new ClassFactory(LineRenderer));