jqPlot荧光笔改变x值

时间:2012-07-10 04:14:01

标签: jquery jqplot

我有一个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参数但无法使其工作。

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

感谢。

2 个答案:

答案 0 :(得分: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");
    }
});

For a working code sample please see.

答案 1 :(得分: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