Bubble chart Zero
HTML
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-more.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="height: 600px; width: 600px; margin: 0 auto"></div>
JavaScript
$(function() {
$('#container').highcharts({
chart: {
type: 'bubble'
},
yAxis: {
min: 0, //STEP 1: uncomment this
startOnTick: true,
endOnTick: true
},
series: [{
data: [
[25, 1, 5000], //STEP 2: uncomment this. This point will display clipped when yAxis min:0
[1, 100, 5000],
[50, 50, 2500],
[1, 50, 1]
]
}
//STEP 3: uncommnet this and comment out yAxis min:0
//This workaround helps, but it is sooooo ugly
/*
, {
type: 'scatter',
data: [
[25, 10]
],
marker: {
radius: 0
},
showInLegend: false
}
*/
]
});
});