【问题标题】:FLEX: Make LineChart DATATIP constrain to vertical axisFLEX:使 LineChart DATATIP 约束到垂直轴
【发布时间】:2009-02-28 00:16:36
【问题描述】:

在制作折线图时,可以说它是针对不同部门的业务销售,横向是天数,纵向是美元。当您将鼠标悬停在一条线上时,它会告诉数据提示告诉您该部门的销售额。在那一天。我希望它同时显示所有部门,所以假设您将鼠标悬停在第 3 天,我希望显示第 3 天所有部门的数据提示,以便您可以比较同一天所有销售的值。我将数据提示的 mouseSensitivity 设置为一次显示所有行,但我最终得到一个部门的第 2 天和另一个不需要的第 3 天。这实际上是作为一个错误发布的,并在此处进行了更好的解释:http://bugs.adobe.com/jira/browse/FLEXDMV-1853

我想知道是否有人可以为此提出解决方法?

谢谢!

【问题讨论】:

    标签: apache-flex actionscript-3 charts linechart


    【解决方案1】:

    我最近遇到了与此类似的问题,并提出了一个也适用于您的问题的解决方案。我有一个步骤 LineChart 并希望在用户悬停在线上的任何位置而不是仅在定义的数据点时显示数据提示。

    您可以在此处阅读我为该问题编写的解决方案:Flex: Customizing data tip location and behavior in a LineChart

    您必须稍微修改我的解决方案以适应您的问题:

    在第 47 行,您可以删除 Math.abs(last.y - mouseLoc.y) < 50 检查。这会将数据提示限制在鼠标垂直方向 50 像素以内的行。

    我假设您使用的是默认的 segment 折线图,它只是在数据点之间直接绘制线条。您需要修改在给定 x 坐标处计算线值的代码,以使用该图表类型。我已经在第 33-41 行找到了鼠标左侧最近的数据点,并将其存储在 last 中。只需获取下一个数据点(这将是最接近鼠标右侧的那个)并使用类似这样的方法来获取鼠标处的值:

    var slope:Number = (nextPoint.y - last.y) / (nextPoint.x - last.x);
    var lineYAtMouse:Number = (slope * (last.x - mouseLoc.x)) + last.y;
    var lineValue:Array = line.localToData(new Point(mouseLoc.x, lineYAtMouse));
    

    然后将第 69 到 72 行替换为:

    hitPoint.x = mouseLoc.x;
    hitPoint.y = lineYAtMouse;
    hitPoint.xValue = lineValue[0];
    hitPoint.yValue = lineValue[1];
    

    我还没有测试过这些修改,所以可能存在一个或 2 个错误,但总体思路是存在的。我希望也许这对某人仍然有用。这个问题已经很老了。 :)

    【讨论】:

    【解决方案2】:

    不是一个答案,而是一个糟糕的选择:

    您可以创建自己的 DataTip 渲染器,该渲染器 [ahem] 映射每个点的位置并为那里的每个点绘制提示。

    基本上,您会在图表类中复制大量代码。

    【讨论】:

      【解决方案3】:

      我有同样的问题,但在柱形图上工作。正在考虑我可以使用 backgroundElements 启用垂直网格线,然后为鼠标悬停添加图表事件侦听器(当鼠标经过垂直网格线时触发)。使用 localX 值,我可以将其与最近的数据点进行比较。

      布赖恩

      【讨论】: