Верхние диаграммы: линии сетки по оси Y смещены

#javascript #highcharts

#javascript #highcharts

Вопрос:

Я пытаюсь создать диаграмму в Highcharts с несколькими рядами данных, с разными осями y для каждой серии. Это отлично работает, используя стандартную функциональность (массив определений по оси Y) для линейных диаграмм. Однако, когда одна из осей y определена как логарифмическая, линии сетки и метки осей смещаются.

Код JSFiddle, демонстрирующий проблему: JSFiddle

Я бы хотел, чтобы на оси «Осадков» были метки в позициях, соответствующих меткам на оси «Температура». Я могу просто настроить gridLineWidth: 0 скрытие линий сетки от просмотра, однако метки по-прежнему смещены. Есть ли простой способ решить эту проблему? Я попытался найти решение с использованием tickPositioner функциональности, но это кажется сложным решением того, что, казалось бы, должно быть общей проблемой.

Комментарии:

1. ось logartihm не имеет регулярного интервала между отметками, поэтому вы не можете выровнять эти оба типа.

2. Даже при использовании логарифмической оси должна быть возможность вычислять значения для меток второй оси, которые соответствуют положению меток / линий сетки первой оси — хотя метки могут не быть целочисленными значениями, должно быть сопоставление.

Ответ №1:

Причина, по которой они не выстраиваются в линию, заключается в том, что ваша логритмическая ось не начинается с нуля. На оси журнала не может быть нуля, но вы можете приблизиться к нему, установив минимальное значение 1.

  , { // Secondary yAxis
        min:1,
  

http://jsfiddle.net/4LKW2/

Однако, если вы хотите принудительно ввести минимальные и максимальные значения, я думаю, вам придется использовать tickPositioner или tickPositions, например

 tickPositions:[Math.log(24)/Math.log(10),Math.log(42)/Math.log(10),Math.log(73)/Math.log(10),Math.log(129)/Math.log(10),Math.log(225)/Math.log(10),Math.log(400)/Math.log(10)],
  

http://jsfiddle.net/SWrd6/

Комментарии:

1. Я не хочу начинать свою ось с нуля — например, если мои данные варьируются от 10 000 до 100 000, это создаст много ненужного пробела на графике. Я также не могу установить фиксированные значения оси, поскольку данные являются динамическими, и диапазон диаграммы необходимо будет автоматически масштабировать. Я буду изучать дальше tickPositioner , хотя это оказывается сложным.

Ответ №2:

В итоге я создал работоспособное (но неидеальное) решение моей проблемы с помощью tickPositioner функции:

 tickPositioner: function () {
                if (this.tickInterval > .5) { 
                    return null;
                }
                else {
                    var myInterval = (this.max - this.min) / 5;
                    return [this.min, this.min   myInterval, this.min   2 * myInterval, this.min   3 * myInterval, this.min   4 * myInterval, this.max];
                }
            }
  

if Предложение проверяет, будет ли библиотека HighCharts автоматически устанавливать интервал тиков в степени 10 (которые уже распределены равномерно), и если нет, просто вручную устанавливает тики через заданные интервалы (в данном случае 5 равномерно расположенных тиков).). Это работает для логарифмического масштаба, потому что значения положения тиков устанавливаются до того, как берется логарифм, что позволяет равномерно распределять значения тиков с интервалом на логарифмическом графике.