3

我有一个 jqPlot 线图,我正在尝试研究如何自定义 X 值的荧光笔文本。

所以。我有以下内容:

var line1=[100, 68, 63, 36, 28];
var line2=[100, 71, 68, 42, 32];
var line3=[100, 60, 45, 15, 5];
var line4=[100, 76, 58, 22, 8];
var plot3 = $.jqplot('chart3', [line1,line2,line3,line4], {
axes:{
      xaxis: {
               ticks: [  [1, 'group1'], 
                         [2, 'group2'], 
                         [3, 'group3'], 
                         [4, 'group4'], 
                         [5, 'group5']
                      ],
               tickOptions:{
                      showGridline: false,
               },
            },
      yaxis:{
             label:'Percentage',
             labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
             min : 0,
             max : 100,
             pad : 0,
             numberTicks : 11,
            }
    },

哪个正确显示图形,X 轴读取 group1 group2 等...但是当我添加荧光笔选项并例如将鼠标悬停在 line1 tick 2 上时,框显示“2.0, 68”。我想做的是显示“group2, 68”。

我曾尝试使用 formatString 参数,但无法使其正常工作。

有人能指出我正确的方向吗?

谢谢。

4

2 回答 2

2

我可以想出一个解决方案,也许不是最好的,但考虑到您显示的代码,我可以很快想到最合适的解决方案。它涉及使用以下代码。基本上在每次鼠标移动时,neighbour不为空(这是用于显示荧光笔工具提示的条件)我正在将工具提示更改为我喜欢的工具提示。

$("#chart").bind('jqplotMouseMove', function(ev, gridpos, datapos, neighbor, plot) {
    if (neighbor) {
        $(".jqplot-highlighter-tooltip").html("" + plot.axes.xaxis.ticks[neighbor.pointIndex][1] + ", " + datapos.yaxis.toFixed(2) + " Oi");
    }
});

有关工作代码示例,请参阅。

于 2012-07-11T14:57:25.767 回答
1

没有尝试,但这段代码似乎符合您的预期https://gist.github.com/2422033

这是 JqPlot doc highlighter plugin上的链接。检查tooltipAxes物业

这里有一个关于在工具提示上显示系列名称的解决方案的链接,默认情况下不支持。检查评论 #1 https://bitbucket.org/cleonello/jqplot/issue/109/enable-highlighter-tooltip-to-display-label-of-the-series-on#comment-65301

于 2012-07-10T06:30:28.863 回答