#highcharts #angular6
#диаграммы высот #angular6
Вопрос:
Я использую столбчатую диаграмму highchart. Поскольку мое максимальное значение по оси y равно 10, а минимальные значения равны 0. Я хочу показать линии сетки для всех точек от 0 до 10. Если высота диаграммы меньше 185 пикселей, то отображаются только пять линий сетки, а если она больше 185 пикселей, то отображаются линии сетки для всех точек. Я попытался установить тиковый интервал, но минимальный, который я установил на 0.1, показывает только 8 линий сетки. Мой код по оси y — это
yAxis: {
min: 0,
max: 10,
tickInterval: 0.1,
title: {
text: '',
align: 'high'
},
labels: {
x: 1,
y: 3,
formatter: function() {
if (this.pos === 0 || this.pos === 5 || this.pos === 10) {
return this.pos;
}
}
}
}
Как я могу заставить его отображать все линии сетки для каждой точки? Спасибо.
Ответ №1:
В API мы можем прочитать:
tickInterval: число
…
Если интервал tickInterval слишком плотный для отображения меток, Highcharts может удалить отметки.
…
Чтобы отобразить все отметки, используйте tickAmount
свойство:
yAxis: {
...,
tickAmount: 11
}
Живая демонстрация: http://jsfiddle.net/BlackLabel/oqu8hkn9 /
API:
Комментарии:
1. Большое вам спасибо. Сегодня вы помогли мне решить две проблемы. Большое вам спасибо!
Ответ №2:
Вам нужно установить свойства линии сетки, чтобы достичь того, что вам нужно.
Вот пример с 10 линиями сетки, показанными всегда. Это настроено следующим образом:
yAxis: {
minorGridLineWidth: 1,
minorTickInterval: 1,
gridLineWidth: 0,
...
}
Рабочий JSFiddle: https://jsfiddle.net/ewolden/1cm6qd0n/8 /
API для линий сетки: https://api.highcharts.com/highcharts/yAxis.minorGridLineWidth