如何在chartjs中实现“自动跳过”功能？ [英] How do I implement the 'autoskip' feature in chartjs?

问题描述

示例




我正在尝试使用chart.js文档中的自动跳过功能：

Example

I am trying to use the autoSkip feature found here in the chart.js documentation:

> https://www.chartjs.org/docs/latest/axes/cartesian/?h=autoskip

我遇到的问题是我的x轴标签重叠（请参见上面的示例）。
我读过的所有内容都说此autoSkip功能应自动跳过重叠的标签。但是，将其设置为true或false时，图表中似乎没有任何变化。

The issue I am having is my x-axes labels are overlapping (see above example). Everything I have read says this autoSkip feature should automatically skip overlapping labels. However, when setting this to both true or false, nothing seems to change in my chart.

 <Line
    data={this.state.chartData}
    options={{
      elements: {
        point: {
          radius: 2
        }
      },
      tooltips: {
        mode: 'nearest',
        intersect: false
      },
      scales: {
        yAxes: [{
          ticks: {
            stepSize: 1, //sets the interval that our y axis counts by
            beginAtZero: false, //starts our graph at 0 if true
          },
          gridLines: {
            drawOnChartArea: false
          }
        }],
        xAxes: [{
          ticks: {
            minRotation: 88,
            autoskip: true,
            autoSkipPadding: 50
          },
          gridLines: {
            drawOnChartArea: false
          },
          type: 'time',
          distribution: 'series',
          time: {
            unit: 'day',
            displayFormats: {
              day: 'MMM D',

            },
            tooltipFormat: 'MMM D h:mm a',
          },
        },
        ]
      },
      responsive: true, //lets us resize our chart
      maintainAspectRatio: true,  //lets us resize our chart
    }
    }

  />

推荐答案

万一有人想知道，请更新至2.9。确认该问题已解决。

In case anyone is wondering, please update to 2.9. Confirmed that the issue is resolved there.

https://github.com/chartjs/Chart.js/issues/6591

这篇关于如何在chartjs中实现“自动跳过”功能？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！