Highcharts, равно, как и Highstock, по моему личному мнению — лучшие вариант для оформления графического представления данных. Сейчас приведу пример, как сделать несколько осей Y, при этом разнести их в разные стороны.
Ниже приведен код, демонстрирующий наглядный пример использования нескольких осей.
Сперва создаются серии — обратите внимание на параметр yAxis
— в нем хранится индекс оси, который мы используем.
$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename='+ name.toLowerCase() +'-c.json&callback=?', function(data) { seriesOptions[i] = { name: name, data: data, yAxis:i }; }
Далее, при инициализации графика в параметре yAxis
нам следует указать массив объектов. Именно индексы этих объектов мы указывали выше, при объявлении серий.
Их соответствие и будет отвечать за параметры отрисовки той или иной серии.
yAxis: [{ labels: { formatter: function() { return (this.value > 0 ? '+' : '') + this.value + '%'; } }, plotLines: [{ value: 0, width: 2, color: 'silver' }] }, {opposite:true}, {opposite:true}, {opposite:true} ],
Решение с отличным примером было найдено здесь.