jqPlot荧光笔改变x值 [英] jqPlot highlighter change x value

问题描述

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

I have a jqPlot Line graph and I am trying to work out how to customise what the highlighter text is for the X value.

所以。我有以下内容：

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。

Which displays the graph correctly, with the X-Axis reading group1 group2 etc... however when I add the highlighter option and for example hover over line1 tick 2 the box displays "2.0, 68". What I would like it to do is display "group2, 68".

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

I have tried playing with the formatString parameter but cannot get it to work.

有人可能指向我正确的方向？

could someone point me in the right direction?

谢谢。

推荐答案

我可以上来一个解决方案，也许不是最好的解决方案，但最合适的一个，我可以快速考虑考虑你展示的代码。它涉及使用以下代码。基本上在每次鼠标移动时，邻居不为空（这是用于显示荧光笔工具提示的条件）我将工具提示更改为我喜欢的工具提示。

I can come up with a solution, maybe not the best one, but the most appropriate one that I could quickly think of considering the code you showed. It involves the use of the below code. Basically on every mouse move, where the neighbour is not null (this is the condition used for showing of the highlighter tooltip) I am changing the tooltip to one I like.

$("#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");
    }
});

有关正常工作的代码示例，请参阅。

这篇关于jqPlot荧光笔改变x值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！