TooltipHighchartsRunAround
HTML
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/highcharts-more.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="height: 400px; min-width: 310px; max-width: 600px; margin: 0 auto"></div>
JavaScript
$(function () {
$('#container').highcharts({
chart: {
type: 'bubble',
zoomType: 'xy'
},
title: {
text: 'Testing tooltip run around!'
},
plotOptions: {
bubble: {
minSize: '4px',
//maxSize: '140px',
dataLabels: {
enabled: true,
crop: false,
color: '#000000',
style: { textShadow: 'none' },
align: 'left',
verticalAlign: 'top',
formatter: function() {
return this.point.name;
}
},
tooltip: {
followPointer: true
}
}
},
tooltip: {
formatter: function() {
return "Here is a tooltip for " + this.point.name;
}
},
series: [
{
name: 'Women',
marker: { fillColor: 'pink' },
data: [
{ name: 'Alice Pasternak', x: 1, y: 8, z: 1},
{ name: 'Carol White', x: 2, y: 8, z: 2},
{ name: 'Eve Wild', x: 3, y: 8, z: 4}
]
},
{
name: 'Men',
marker: { fillColor: 'lightblue' },
data: [
{ name: 'Bob Jones', x: 1, y: 3, z:1},
{ name: 'Dan', x: 2, y: 3, z: 2},
{ name: 'Frank', x: 3, y: 3, z: 4}
]
}
]
});
});