在JqPlot中无法读取更高的选项中的值

Question

我需要显示一些细节点，而用户，，鼠标在上面(点击也可以)。问题是，当我设置jqplot荧光笔选项时，我无法从这一点获得好的数据。

在默认情况下设置荧光笔时，它会显示值ok (与轴上的值相同--但我需要格式化它)。所以我使用highlighter: {formatString:...}，但我只能获得静态文本(因为字符串没有对内部的任何变量进行解析)。

这是代码：

     $(document).ready(function(){

    var line1 = [['2013-02-01 09:12:03',120.4],['2013-02-01 09:23:00',121.6],['2013-02-02 09:39:28',120.1],['2013-02-02 09:47:23',119.0],['2013-02-04 09:10:33',117.4],['2013-02-04 09:15:54',118.2],['2013-02-05 09:32:25',121.3],['2013-02-05 09:39:27',123.4],['2013-02-06 08:54:20',120.4],['2013-02-06 09:02:02',121.3],['2013-02-07 08:56:49',119.3],['2013-02-07 09:11:46',120.7],['2013-02-08 09:25:14',120.8],['2013-02-08 09:42:09',122.9],['2013-02-09 10:16:35',120.1],['2013-02-09 10:33:21',121.6],['2013-02-11 10:17:52',117.9],['2013-02-11 10:25:43',119.4],['2013-02-12 09:38:00',120.8],['2013-02-12 09:47:54',121.3],['2013-02-12 10:26:11',119.0],['2013-02-13 09:33:24',121.0],['2013-02-13 09:39:17',121.1],['2013-02-13 14:13:27',121.2],['2013-02-14 08:46:32',118.5],['2013-02-14 08:55:13',119.1],['2013-02-15 09:32:48',121.5],['2013-02-15 09:38:37',121.7],['2013-02-16 10:02:50',119.3],['2013-02-16 10:07:35',119.5],['2013-02-18 09:49:57',119.9],['2013-02-18 09:57:26',120.6],['2013-02-19 10:38:43',119.6],['2013-02-19 10:56:14',120.8],['2013-02-20 09:20:57',119.2],['2013-02-20 09:30:46',119.9],['2013-02-21 09:19:57',119.9],['2013-02-21 09:25:40',119.7],];
    var line_oczekiwana_srednia=[['2013-02-01 ',121.0000],['2013-02-21 ',121.0000]];

    var line_sd_plus_1=[['2013-02-01 ',123.42],['2013-02-21 ',123.42]];
    var line_sd_plus_2=[['2013-02-01 ',125.84],['2013-02-21 ',125.84]];
    var line_sd_plus_3=[['2013-02-01 ',128.26],['2013-02-21 ',128.26]];
    var line_sd_plus_4=[['2013-02-01 ',130.68],['2013-02-21 ',130.68]];
    var line_sd_minus_1=[['2013-02-01 ',118.58],['2013-02-21 ',118.58]];
    var line_sd_minus_2=[['2013-02-01 ',116.16],['2013-02-21 ',116.16]];
    var line_sd_minus_3=[['2013-02-01 ',113.74],['2013-02-21 ',113.74]];
    var line_sd_minus_4=[['2013-02-01 ',111.32],['2013-02-21 ',111.32]];

    var line_punty_przekraczajace_SD = []    
    //var line_punty_przekraczajace_reguly_westgarda_SD = []
    var line_WEST1 = [];var line_WEST3 = [];var line_WEST8 = [];var line_WEST9 = [];var line_WEST12 = [];    


    var plot2 = $.jqplot('chart2', [line_sd_plus_1, line_sd_plus_2, line_sd_plus_3, line_sd_plus_4, line_oczekiwana_srednia, line_sd_minus_1, line_sd_minus_2, line_sd_minus_3, line_sd_minus_4, line1, line_WEST1, line_WEST3, line_WEST8, line_WEST9, line_WEST12, ], {
        animate: true,
        title:'Dane materiału CONTROL SERUM 1  031(Surowica).   ', 
        axes:{
          xaxis:{
            renderer:$.jqplot.DateAxisRenderer,
            tickOptions:{ 
              formatString:'%#d-%m-%y %#H:%M',
              angle: -30,
            },
            tickRenderer:$.jqplot.CanvasAxisTickRenderer,
            label:'Start: 2013-2-1 Koniec: 2013-2-21', 
            labelOptions:{
              fontFamily:'Helvetica',
              fontSize: '14pt'
            },
            labelRenderer: $.jqplot.CanvasAxisLabelRenderer
          },           
          yaxis:{
            //min:111.32, 
            //max:130.68,
            numberTicks: 9,

            ticks:[[111.32,'111.32(-SD4)'],[113.74,'113.74(-SD3)'],[116.16,'116.16(-SD2)'],[118.58,'118.58(-SD1)'],[121.0000,'121.0000'],[123.42,'123.42(+SD1)'],[125.84,'125.84(+SD2)'],[128.26,'128.26(+SD3)'],[130.68,'130.68(+SD4)']],
            renderer:$.jqplot.LogAxisRenderer,
            tickOptions:{
              showGridline: false,
              formatString:'Wynik: %.1f',
              //formatString:'SD',
              labelPosition: 'middle', 
              angle:-0,
            },
            tickRenderer:$.jqplot.CanvasAxisTickRenderer,
            labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
            labelOptions:{
                fontFamily:'Helvetica',
                fontSize: '14pt'
            },
            label:'Wartości w mmol/l'
          },       
        },
        highlighter: {
          show: true,
          sizeAdjust: 12.5,
          tooltipFadeSpeed: 'fast',
          //formatString:'<table><tr><td>Data: %Y-%m-%d.%H:%M:%S</td></tr><tr><td>Wynik: %.1f</td></tr></table>'
        },
        cursor: {
          show: true,
          zoom:true,
          dblClickReset:true,
          tooltipLocation:'sw'
        },        
        series:[
          {lineWidth:1, color: '#d8d8d8', showMarker: false},
          {lineWidth:1, color: '#d8d8d8', showMarker: false},
          {lineWidth:1, color: '#d8d8d8', showMarker: false},
          {lineWidth:1, color: '#d8d8d8', showMarker: false},
          {lineWidth:1, color: '#76a4e8', showMarker: false},
          {lineWidth:1, color: '#d8d8d8', showMarker: false},
          {lineWidth:1, color: '#d8d8d8', showMarker: false},
          {lineWidth:1, color: '#d8d8d8', showMarker: false},                                                            
          {lineWidth:1, color: '#d8d8d8', showMarker: false},
          {
            lineWidth:0.5, 
            color: 'green', 
            rendererOptions: {animation: {speed: 1500}}, 
            markerOptions:{color: 'green', 
            style:'filledSquare'},
            highlighter: {formatString:'<table><tr><td>Data: %Y-%m-%d.%H:%M:%S</td></tr><tr><td>Wynik: %.1f</td></tr></table>'}            
          },
          {showLine: false, color: 'red', markerOptions:{color: 'red', style:'filledSquare'}},{showLine: false, color: 'red', markerOptions:{color: 'red', style:'filledSquare'}},{showLine: false, color: 'red', markerOptions:{color: 'red', style:'filledSquare'}},{showLine: false, color: 'red', markerOptions:{color: 'red', style:'filledSquare'}},{showLine: false, color: 'red', markerOptions:{color: 'red', style:'filledSquare'}},
        ],
        legend:{
           renderer: jQuery.jqplot.EnhancedLegendRenderer,
           show: true,
           hideZeros: true,
           location: 'e',
           labels: [ 'SD+4 (130.68)', 'SD+3 (128.26)', 'SD+2 (125.84)', 'SD+1 (123.42)','Oczekiwane (121.0000)', 'SD-1 (118.58)', 'SD-2 (116.16)', 'SD-3 (113.74)', 'SD-4 (111.32)', 'Wyniki kontroli', 'Reguła WEST1 1-2s (brak)', 'Reguła WEST3 1-3s (brak)', 'Reguła WEST8 2-2s (brak)', 'Reguła WEST9 4-1s (brak)', 'Reguła WEST12 3-1s (brak)', ],
           placement: 'outsideGrid'
        }        

    });
  });
  </script>

  <!-- jqPlot -->
  <script class="include" type="text/javascript" src="plugins/jqPlot/jquery.jqplot.min.js"></script>
  <script class="include" language="javascript" type="text/javascript" src="plugins/jqPlot/plugins/jqplot.highlighter.min.js"></script>
  <script class="include" language="javascript" type="text/javascript" src="plugins/jqPlot/plugins/jqplot.cursor.min.js"></script>
  <script class="include" language="javascript" type="text/javascript" src="plugins/jqPlot/plugins/jqplot.dateAxisRenderer.min.js"></script>
  <script class="include" language="javascript" type="text/javascript" src="plugins/jqPlot/plugins/jqplot.enhancedLegendRenderer.min.js"></script>
  <script class="include" type="text/javascript" src="plugins/jqPlot/plugins/jqplot.canvasTextRenderer.min.js"></script>
  <script class="include" type="text/javascript" src="plugins/jqPlot/plugins/jqplot.canvasAxisLabelRenderer.min.js"></script>
  <script class="include" type="text/javascript" src="plugins/jqPlot/plugins/jqplot.canvasAxisTickRenderer.min.js"></script>
  <script class="include" type="text/javascript" src="plugins/jqPlot/plugins/jqplot.categoryAxisRenderer.min.js"></script>

我得到的是：

​

​

%Y %m %d .其他的没有被翻译出来。为什么我不能得到正确的价值观？提前鸣谢。

Answer 1

默认情况下，useAxesFormatters在荧光笔上设置为true。这意味着您实际上正在接收由轴格式化程序格式化的数据。在您的示例中，两个格式化程序将生成表单'%#d-%m-%y %#H:%M'的日期值和表单'Wynik: %.1f'的y轴值。

这意味着您可以将系列荧光笔格式更改为：

formatString:'Data: %s, %s'

应用时，第一个%s将被格式化的日期字符串(例如5-02-139:39)替换，第二个将被格式化的Wynik值(例如Wynik 123.4)所取代。

有关更多细节，请参见文档。