当用户将鼠标悬停在其上时,我需要显示该点的一些详细信息(单击也可以)。问题是当我设置 jqplot 荧光笔选项时,我无法从这一点获得好的数据。
虽然荧光笔设置为默认值,但它显示的值正常(与轴上的相同 - 但我需要对其进行格式化)。所以我使用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 .... 和其他没有被翻译。为什么我不能得到正确的值?提前谢谢。