Как сместить точки сетки и оси Y и метки с помощью chart.js? - PullRequest
Новая
       16

Как сместить точки сетки и оси Y и метки с помощью chart.js?

0 голосов
/ 23 июня 2019

Я хочу, чтобы мой линейный график выглядел так: https://ibb.co/F3c5QBt

Это мой код JS: 

let traffic=document.getElementById('web-traffic').getContext('2d');
var myLineChart = new Chart(traffic, {
    // The type of chart we want to create
    type: 'line',

    // The data for our dataset
    data: {
        labels: ['16-22', '23-29', '30-5', '6-12', '13-19', '20-26', '27-3','4-10','11-17','18-24','25-31'],
        datasets: [{
            label: 'My First dataset',
            backgroundColor: 'rgb(226,227,247, 0.6)',
            borderColor: 'purple',
            data: [600, 700, 650, 800, 900, 950, 1000, 850, 900, 550, 1000, 2000, 1500]
        }]
    },

    // Configuration options go here
    options: {
        layout: {
            padding: {
                right: 300
            }
        },
        scales: {
            gridLines: {
                offsetGridLines: true
            },
            yAxes: [{
                ticks: {
                    min: 500,
                    max: 2500,
                    stepSize: 500
                }
            }], 
            xAxes: [{
                ticks: {
                    // labelOffset: 50
                }
            }]
        }
    }
});

Я попытался установить значения смещения по осям X и Y, но нашелэто будет неаккуратное решение.Затем я попытался установить для offsetGridLines значение true, но это, похоже, не дало результата.

Имеет ли значение количество точек данных и меток?

Как добиться желаемого вида меток и сетки?линии на фото выше?

Спасибо

1 Ответ

0 голосов
/ 26 июня 2019

На этой диаграмме есть некоторые точки данных на линиях сетки и некоторые между ними.Вы не можете сделать это в Chart.js.Только один или другой, который можно контролировать с помощью offsetGridLines

...