从外部输入饼图时工具提示工作正常,但切片之间的过渡导致工具提示消失&没有创建新的。
以下是我的jsfiddle snippet,非常基于this SO answer提供的有用建议。
我知道如何让工具提示作为一个整体工作,因为看到another jsfiddle这样做但我希望工具提示位于特定切片之上。
我在bubble plots上看过http://www.jqplot.com示例,但由于它使用了plot1b.axes.xaxis等,我认为它不适用于馅饼或甜甜圈?
$(document).ready(function () {
var data = [
['Heavy Industry', 12],['Retail', 9], ['Light Industry', 14],
['Out of home', 16],['Commuting', 7], ['Orientation', 9]
];
plot2 = jQuery.jqplot('chart2', [ data ], {
seriesDefaults: {
shadow: false,
renderer: jQuery.jqplot.PieRenderer,
rendererOptions: {
padding: 2,
sliceMargin: 2,
showDataLabels: true,
highlightMouseOver: true
},
highlighter: {
show: true,
formatString: '%s',
tooltipLocation: 'sw',
useAxesFormatters: false
}
}
});
$('#chart2').bind('jqplotDataHighlight',
function (ev, seriesIndex, pointIndex, data) {
console.log("jqplotDataHighlight for " + data)
var $this = $(this);
$this.attr('title', data[0] + ": " + data[1]);
});
$("#chart2").bind('jqplotDataUnhighlight', function (ev, seriesIndex, pointIndex, data) {
console.log("jqplotDataUnhighlight for " + data)
var $this = $(this);
$this.attr('title', "");
});
});