Bubble chart Axes
HTML
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/highcharts-more.js"></script>
<div id="container" style="height: 400px; width: 600px; margin: 0 auto"></div>
JavaScript
Math.easeOutBounce = function (pos) {
if ((pos) < (1 / 2.75)) {
return (7.5625 * pos * pos);
}
if (pos < (2 / 2.75)) {
return (7.5625 * (pos -= (1.5 / 2.75)) * pos + 0.75);
}
if (pos < (2.5 / 2.75)) {
return (7.5625 * (pos -= (2.25 / 2.75)) * pos + 0.9375);
}
return (7.5625 * (pos -= (2.625 / 2.75)) * pos + 0.984375);
};
$(function () {
$('#container').highcharts({
chart: {
type: 'bubble',
},
legend: {
enabled: false
},
title: {
text: 'Highcharts Bubbles'
},
xAxis: {
gridLineWidth: 0,
labels: {
enabled: false
},
lineColor: 'transparent'
},
yAxis: {
gridLineWidth:0,
labels: {
enabled: false
}, title: {
text: ""
},
},
plotOptions: {
series: {
animation: {
duration: 2000,
easing: 'easeOutBounce'
},
dataLabels: {
enabled: true,
}
},
bubble:{
// minSize:100,
//maxSize:200,
}
},
series: [{
color: "rgba(255,0,0,0.5)",
data: [
[20, 36, 79],
[15, 74, 90],
[20, 120, 80],
]
}, {
//color:'#0D233A',
data: [
[24, 30, 87],
[11, 54, 78],
[40, 25, 81]
]
}, {
data: [
[10, 10, 91],
[10, 77, 82]
]
}]
});
});