Применить 0 на оси в пузырьковых диаграммах HighCharts

Я хочу, чтобы ось моей пузырьковой диаграммы начиналась с 0. В любом другом типе диаграммы я бы установил

yAxis: {
   min:0
}

Но это может привести к обрезанию пузырьков со значением y, близким к нулю.

Все, что я смог придумать, это добавить невидимый фиктивный ряд, чтобы заставить ось начинаться с 0.

См. http://jsfiddle.net/kzoon/jd3c9/ для моей проблемы и решения.

Есть ли у кого-нибудь лучшее решение этой проблемы?


person Koos    schedule 12.04.2013    source источник
comment
Извините, я не понимаю, чего именно вы хотите добиться. Вы хотите, чтобы ваша ось Y начиналась с 0, а пузыри не обрезались?   -  person Nina    schedule 12.04.2013
comment
Я хочу, чтобы yAxis не начинался со значения больше 0 (40 в моей скрипке). Пузыри рядом с xAxis НЕ ДОЛЖНЫ быть обрезаны, что происходит, когда я устанавливаю yAxis min на 0 (Шаг 2 в моей скрипке). Я обновил скрипку. Играйте в Шаг 1, Шаг 2, Шаг 3, и вы поймете мою точку зрения.   -  person Koos    schedule 12.04.2013


Ответы (2)


Как насчет использования тикового позиционера? Он позволяет программно устанавливать позиции галочек. Ознакомьтесь с документацией: http://api.highcharts.com/highcharts#yAxis.tickPositioner< /а>

Пример функции может работать следующим образом:

  1. Найдите минимальные и максимальные значения оси
  2. Если min больше 0, используйте 0 как min:
  3. Добавляйте тики каждые «20», если мы не достигнем максимального значения

Здесь вы можете найти код:

yAxis: {
    tickPositioner: function () {
        var positions = [],
            min = Math.floor(this.min / 10) * 10,
            max = Math.ceil(this.max / 10) * 10,
            step = 20,
            tick;

        if (min > 0)
            min = 0;

        tick = min;

        while (tick < max + step) {
            positions.push(tick);
            tick += step;
        }

        return positions;
    }
},

и рабочая демонстрация jsfiddle: http://jsfiddle.net/2ABFW/

person slawekkolodziej    schedule 17.04.2013
comment
Это очень хорошее решение. Не на 100%, потому что я должен выбрать указанный шаг, где я действительно хотел положиться на автоматически рассчитанный шаг с помощью tickPixelInterval. - person Koos; 17.05.2013

Вы можете использовать startWithTick: http://jsfiddle.net/jd3c9/8/

    yAxis: {
        startWithTick: true
    }

Теперь ваша ось Y будет отображать следующий тик ниже 0 (в данном случае -20), и пузырь не будет обрезан.

person Nina    schedule 12.04.2013
comment
Хорошо, теперь я знаю, что вы имеете в виду. Я не знаю стандартного решения для этого. Я думаю, что вычислить минимальное значение yAxis было бы правильно. Переберите все данные и получите минимальное значение y из всех записей данных. Если это значение выше 0, установите 0 по умолчанию, в противном случае вычтите «буфер» (по крайней мере, половину высоты вашего самого низкого пузырька данных) из этого расчетного значения и установите его на оси y как мин. Я думаю, это более элегантно, чем добавление невидимой точки на график. Извините, я не мог предоставить лучший или более простой стандартный способ. Надеюсь, это поможет в любом случае. - person Nina; 12.04.2013
comment
Спасибо за ваши усилия в любом случае - person Koos; 12.04.2013