自定义 Flex 图表数据提示答案

【问题标题】：Custom Flex charting datatip自定义 Flex 图表数据提示
【发布时间】：2011-04-15 15:59:17
【问题描述】：

我想在这里模拟谷歌金融的数据提示功能 - http://www.google.com/finance?q=INDE...EXNASDAQ:.IXIC

而当您将鼠标悬停在图表上时，数据提示不会出现在图表上，而是锚定在图表的右上角。我该怎么做呢？提前谢谢！

音调

【问题讨论】：

【解决方案1】：

我的做法是让图表组件处理 mousemove 并检索鼠标相对于数据的位置，并将该单个数据点存储到 mouseOverData 之类的属性中，然后将其绑定到另一个组件，例如顶部'工具提示'。这是一个扁平化组件的示例（扁平化是因为我会为每个组件创建单独的文件以便在我的项目中重用）：

<s:VGroup>
<s:HGroup>
<s:Label text="Some Label: {mouseOverData.someProperty}" />
<s:Label text="Second Label: {mouseOverData.secondProperty}" />
</s:HGroup>
<mx:LineChart mouseMove="calculateMousePositionRelativeToDataAndStoreInMouseOverDataProp(event)" />
</s:VGroup>

【讨论】：

效果很好，正是我想要的。谢谢！