JavaScript
var begin = Date.UTC(2012, 0, 31); // the earliest/first time of both series
var end = Date.UTC(2014, 11, 31); // the latest/last time of both series
var beginLargest = Date.UTC(2012, 5, 30); // the first time of the series with the
// .. largest interval between datapoints
var endLargest = Date.UTC(2014, 5, 30); // the last time of the series with the
// .. largest interval between datapoints
var yearRange = (end - begin) / (365 * 60 * 60 * 24 * 1000);
var yearBegExtra = (beginLargest - begin) / (365 * 60 * 60 * 24 * 1000);
var yearEndExtra = (endLargest - end) / (365 * 60 * 60 * 24 * 1000);
var marginBegin = yearBegExtra / yearRange;
var marginEnd = yearEndExtra / yearRange;
$(function () {
$('#container').highcharts({
title: {
text: 'Multiple series with different plots'
},
xAxis: {
type: 'datetime',
minPadding: -marginBegin + 0.005,
maxPadding: marginEnd + 0.005
},
yAxis: [{
title: null
}, {
title: null,
opposite: true
}],
series: [{
name: 'Monthly',
type: 'line',
yAxis: 0,
data: [
[Date.UTC(2012, 0, 31), 11],
[Date.UTC(2012, 1, 28), 12],
[Date.UTC(2012, 2, 31), 13],
[Date.UTC(2012, 3, 30), 15],
[Date.UTC(2012, 4, 30), 18],
[Date.UTC(2012, 5, 31), 16],
[Date.UTC(2012, 6, 31), 14],
[Date.UTC(2012, 7, 31), 18],
[Date.UTC(2012, 8, 30), 17],
[Date.UTC(2012, 9, 31), 11],
[Date.UTC(2012, 10, 30), 16],
[Date.UTC(2012, 11, 31), 12],
[Date.UTC(2013, 0, 31), 19],
[Date.UTC(2013, 1, 28), 21],
...