look at the following fiddle: http://jsfiddle.net/fmarino/q9c31a1g/3/
$(function () {
$('#container').highcharts({
chart: {
zoomType: 'x'
},
credits: {
enabled: false
}, title: {
text: 'Production per orbit'
},
xAxis: {
crosshair: true,
title: {
text: 'Orbits'
} },
yAxis: {
min: 0,
title: {
text: 'Volume'
}
},
legend: {
align: 'right',
x: -30,
verticalAlign: 'top',
y: 25,
floating: true,
backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || 'white',
borderColor: '#CCC',
borderWidth: 1,
shadow: false }, tooltip: {
headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
'<td style="padding:0"><b>{point.y}</b></td></tr>',
footerFormat: '</table>',
shared: true,
useHTML: true
},
plotOptions: {
bar: {
dataLabels: {
enabled: true
}
},
column: {
dataLabels: {
enabled: true
},
pointPadding: 0.2,
borderWidth: 0
}
},
exporting: {
sourceWidth: 1400,
sourceHeight: 400,
// scale: 2 (default)
chartOptions: {
subtitle: null
}
}, series: [ {
name: 'Total Size',
data: [...]
});
});
then try to zoom in on the section on the left. To me (firefox) it only shows l2 size after zooming. Am I doing something wrong? What is the correct way to implement zooming on such chart?
Thank you
as Halvor suggested, my data wasn't sorted. Actually it had a reverse order, an some point were missing.
Sorting data in ascending mode fixed the issue.
Thank you.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.