使用dataTipFunction可以很方便的自定义图表上元素的提示信息。不管是内容还是格式。

<?xml version="1.0"?>
<s: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"
			   creationComplete="init(event)">
	<fx:Script>
		<![CDATA[
			import mx.charts.HitData;
			import mx.collections.ArrayCollection;
			import mx.events.FlexEvent;
			
			[Bindable]
			private var myData:ArrayCollection = new ArrayCollection( [
				{ month: "18:00", value: 20},
				{ month: "19:00", value: 60},
				{ month: "20:00", value: 215},
				{ month: "21:00", value: 202},
				{ month: "22:00", value: 190},
				{ month: "23:00", value: 95}]);
			
			protected function init(event:FlexEvent):void
			{
				line1.setStyle("fill", 0xffffff); //原点内部填充色为白色
				line1.setStyle("radius", 5); //整个圆点的半径为6
			}
			
			private function dataTips(e:HitData):String{
				var s:String= "<b>"+LineSeries(e.element).displayName+"</b>"
					+"："+e.chartItem["yValue"]+"个";
				return s; 
			}
		]]>
	</fx:Script>
	
	<fx:Declarations>
		<!-- 轴线样式 (暂时不需要，改成背景上绘制)-->
		<mx:SolidColorStroke id = "axisS1" color="0xE3E3E3" weight="1" alpha="0"/>
		<!-- 线条样式 -->
		<mx:SolidColorStroke id = "lineS1" color="0x008EFF" weight="2"/>
		<!-- 线条点样式 （外圈颜色同线条颜色，外圈线条粗细为1) -->
		<mx:SolidColorStroke id = "pointS1" color="0x008EFF" weight="1"/>
	</fx:Declarations>
	
	<mx:LineChart id="linechart" height="60%" width="60%" seriesFilters="[]"
				  verticalCenter="0" horizontalCenter="0" fontSize="12" color="0x707070"
				  showDataTips="true" dataProvider="{myData}"
				  dataTipFunction="dataTips">
		<mx:backgroundElements>
			<s:Group width="100%" height="100%">
				<s:Rect left="0" right="1" top="0" bottom="0">
					<s:fill>
						<s:SolidColor alpha="1" color="#F5F5F5"/>
					</s:fill>    
					<s:stroke>
						<s:SolidColorStroke color="0xE3E3E3" weight="1"/>
					</s:stroke>
				</s:Rect>
				
			</s:Group>
			<mx:GridLines gridDirection="both" >
				<mx:horizontalStroke>
					<mx:SolidColorStroke  color="0xE3E3E3" weight="1"/>
				</mx:horizontalStroke>
				<mx:verticalStroke>
					<mx:SolidColorStroke  color="0xEAEAEA" weight="1"/>
				</mx:verticalStroke>
			</mx:GridLines>
			
		</mx:backgroundElements>
		<mx:horizontalAxis>
			<mx:CategoryAxis id="hAxis" categoryField="month"/>
		</mx:horizontalAxis>
		<mx:horizontalAxisRenderers>
			<mx:AxisRenderer axis="{hAxis}" tickPlacement="none" minorTickPlacement="none"
							 axisStroke="{axisS1}"/>
		</mx:horizontalAxisRenderers>
		<mx:verticalAxis>
			<mx:LinearAxis id="vAxis"/>
		</mx:verticalAxis>
		<mx:verticalAxisRenderers>
			<mx:AxisRenderer axis="{vAxis}" tickPlacement="none" minorTickPlacement="none"
							 axisStroke="{axisS1}"/>
		</mx:verticalAxisRenderers>
		<mx:series>
			<mx:LineSeries  id="line1" yField="value" form="segment" displayName="数量"
							itemRenderer="mx.charts.renderers.CircleItemRenderer"
							stroke="{pointS1}" lineStroke="{lineS1}"/>
		</mx:series>
	</mx:LineChart>
</s:Application>