我正在使用 Cursor 插件在 jqplot 图表上显示垂直线。 Cursor 插件的工具提示显示 X 和 Y 值。
我想为情节点添加一段元数据。
[x,y,1337] 其中 1337 是元数据。
我想修改 Cursor 插件工具提示以显示此元数据以及它已经显示的数据。
用例:我有多个系列,所有系列都已缩放到 0-100 以进行趋势分析。我需要显示未缩放的值。
更新:
我已经通过破解 jqplot.cursor.js 让它工作了,有没有更好的方法?
Line 468: function updateToolTip(gridpos, datapos, plot){
// ...
s += $.jqplot.sprintf(c.tooltipFormatString, label, sx, sy, data[2]);
最佳答案
这就是我重写 tooltipContentEditor
jqplot 函数的方式,效果很好。
highlighter: {
show: true,
showMarker:true,
showTooltip:true,
sizeAdjust: 10,
tooltipLocation: 'se',
tooltipAxes: 'xy',
yvalues: 1,
formatString:'<table class="jqplot-highlighter"><tr><td>date:</td><td>%s</td></tr><tr><td>PiecesPerHour:</td><td align="right">%s</td></tr></table>',
useAxesFormatters: true,
tooltipContentEditor: function(str, seriesIndex, pointIndex, plot){
var data = plot.series[seriesIndex].data[pointIndex];
var label = plot.legend.labels[seriesIndex].indexOf('Target')
var format = [];
//A little formatting to the data before I join it to the Html string
if (that.model.get('groupBy')==='month')
format[0] = new Date(data[0] + 1000*60*60*24).format('mmmm yyyy');
else
format[0] = new Date(data[0] ).format('mmmm dd, yyyy');
format[1] = new Number(data[1]).toFixed(1)
//join the data to the Html string:
str = $.jqplot.sprintf.apply($.jqplot.sprintf, [str].concat(format));
return str;
}
}
基本上,您获取 Series 和 Point 数据并使用 sprintf 将其连接到 Html 字符串,然后返回该字符串。
关于javascript - jqPlot 显示带有光标的自定义工具提示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16840669/