避免在条形图的条形图中显示工具提示
问题描述:
我已经在条形图之间创建了空间。但我只想在栏上显示工具提示,而不是在空白处。避免在条形图的条形图中显示工具提示
var values = [100.00,100.00,100.00,80.00,80.00,66.67];
// Draw a sparkline for the #sparkline element
$('#sparkline').sparkline(values, {
type: "bar",
// Map the offset in the list of values to a name to use in the tooltip
tooltipFormat: '{{offset:offset}} {{value}}',
barSpacing: '50px',
tooltipValueLookups: {
'offset': {
0: 'Jul',
1: 'Aug',
2: 'Sep',
3: 'Oct',
4: 'Nov',
5: 'Dev',
}
},
})
的的jsfiddle - http://jsfiddle.net/RsbHC/396/
答
也许你可以将鼠标移动侦听器添加绑定到你的火花对象,记录鼠标移动和possition。并决定是否显示工具提示。
var values = [100.00,100.00,100.00,80.00,80.00,66.67];
var barSpacing = 50;
var barWidth = 4;
$('#sparkline').bind('mousemove',function(e){
var xPosInBar = e.offsetX % (barSpacing + barWidth);
if(xPosInBar > barWidth){
$('#jqstooltip').hide();
}else{
$('#jqstooltip').show();
}
});
// Draw a sparkline for the #sparkline element
$('#sparkline').sparkline(values, {
type: "bar",
// Map the offset in the list of values to a name to use in the tooltip
tooltipFormat: '{{offset:offset}} {{value}}',
barWidth: barWidth+'px',
barSpacing: barSpacing+'px',
tooltipValueLookups: {
'offset': {
0: 'Jul',
1: 'Aug',
2: 'Sep',
3: 'Oct',
4: 'Nov',
5: 'Dev',
}
},
});
的的jsfiddle - http://jsfiddle.net/RsbHC/397/
你你自己TooltipClass与.. EHM ...卡恩集'tooltipClassname' – Marcus
的解决方案工作。谢谢。 – TBAG