具有 3 个值（而不是 2 个）的荧光笔 (jquery-jqplot)

Question

我正在使用 jquery 插件 jqplot。我有一个包含三个元素的元组，在图表上元组的第一个元素是 x 轴，y 轴是第二个元素。荧光笔需要显示 x、y 和元组的第三个元素。类似于：

curve1=[**[x,y,date],** [1, 2,'28-May-11'], [2, 4,'30-May-11'], [3,7,'31-May-11']];

荧光笔显示：第一点 (1 , 2 , '28-May-11')，(2,4,'30-May-11')第二...

有什么想法吗？

Answer 1

一种解决方案涉及对 showTooltip 方法中的 jqplot.highlighter.js 进行小修改。
在此方法中，以下行用于将 html 分配给工具提示元素：

elem.html(str);

出于您的目的，您可以使用以下内容覆盖此分配：

elem.html('(' + neighbor.data[0] + ', ' + neighbor.data[1] + ', ' + neighbor.data[2] + ')');

因为 neighbor.data 用于表示包含 3 个值的元组：x、y、和日期。

或者...

更通用的解决方案将允许从前端动态生成工具提示文本（而不是处理 highlighter.js 中的固定格式策略）。在这种情况下，您可以将上述更改替换为以下内容：

elem.html(neighbor.data[2]);

然后将元组的第三个元素从日期（我假设仅用于工具提示的目的）更改为工具提示文本本身。

例如，您的元组可能看起来像：

curve1=[ [1, 2, '(1, 2, 28-May-11)'], [2, 4, '(2, 4, 30-May-11)'], [3,7, '(3, 7, 31-May-11)'] ];

甚至是这样：

curve1=[ [1, 2, 'On 28-May-11 there were 2 instances.'], [2, 4, 'Then on 30-May-11 there were 4.'], ...];

希望有帮助。