Как я могу позволить моему графику увеличить масштаб по оси X?

Я нашел несколько советов о том, как увеличить с ChartJS. Проблема в том, что зум работает по оси Y, но не по оси X. Я не могу решить проблему. Кто-нибудь может мне помочь? Это мой код, где на оси X есть строки с часами и минутами в формате "чч: мм" (я думаю, что это не влияет на проблему):

{
            type: 'line',
            data: {
                labels: labels,
                datasets: [{
                    label: dates,
                    data: eda,
                    lineTension: 0.3,
                    backgroundColor: 'rgba(29, 9, 158,0.2)',
                    borderColor: "rgba(29, 9, 158,1)"
                }]
            },
            options: {
                legend: {
                    display: false
                },
                responsive: true,
                elements: {
                    point: {
                        radius: 0
                    }
                },
                scales: {
                    xAxes: [{
                        ticks: {
                            autoSkip: true,
                            maxTicksLimit: 24
                        }
                    }],
                    yAxes: [
                        {
                            scaleLabel: {
                                display: true,
                                labelString: "EDA Value"
                            },
                            ticks: {
                                beginAtZero: true
                            }
                        }
                    ]
                },
                tooltips: {
                    enabled: false
                },
                plugins: {
                    zoom: {
                        // Container for pan options
                        pan: {
                            // Boolean to enable panning
                            enabled: false
                        },

                        // Container for zoom options
                        zoom: {
                            // Boolean to enable zooming
                            enabled: true,

                            // Enable drag-to-zoom behavior
                            // drag: true,

                            // Drag-to-zoom rectangle style can be customized
                            drag: {
                                 borderColor: 'rgba(225,225,225,0.3)',
                                 borderWidth: 5,
                                 backgroundColor: 'rgb(225,225,225)'
                            },

                            // Zooming directions. Remove the appropriate direction to disable
                            // Eg. 'y' would only allow zooming in the y direction
                            mode: 'xy'
                        }
                    }
                }

0 ответов

Другие вопросы по тегам