Question

我正在使用chartjs来创建一个折线图，它的工作正常，我面临的问题很少，我有像图中那样的线图

我面临的问题是，我需要将相同的日期相互合并，正如您在图片中看到的那样，2017-10-12是多次，这是我的配置

  var config = {
    type: 'line',
    data: {
      labels: labelsZchartjs,
      datasets: [{
        label: " % Allowance Used",
        fill: false,
        backgroundColor: chartColors.blue,
        borderColor: chartColors.blue,
        data: dataZChartsJS,
      }]
    },
    options: {
      legend: {
        labels: {
          boxWidth: 0,
          fontStyle: "bold",
          fontSize: 20
        }
      },
      responsive: true,
      tooltips: {
        bodyFontStyle: "bold",
        mode: 'label',
      },
      hover: {
        mode: 'nearest',
        intersect: true
      },
      scales: {
        xAxes: [{
          ticks: {
              autoSkip : true,
              callback: function(value, index, values) {
                return new moment(value).format('YYYY-MM-DD');
              }
          },
          display: true,
          fontStyle: "bold",
          scaleLabel: {
            fontStyle: "bold",
            display: false,
            labelString: 'Date & Time'
          }
        }],
        yAxes: [{
          ticks: {
              min: 0,
              max: 100,
              stepSize: 10
          },
          display: true,
          fontStyle: "bold",
          scaleLabel: {
            fontStyle: "bold",
            display: true,
            labelString: '% Allowance Used'
          }
        }]
      }
    }
  };

我正在寻找一个建议或方法，使一天的日期更准确，或者在同一天有多个Y轴值，所以我们不能在一天内得到所有值的平均值？或任何可能使这个图表更好的东西，任何帮助都会很明显。数据采用这种格式

[{percentage_used: 0.012, datetime: "2017-09-28 05:50:43"}
{percentage_used: 0.028, datetime: "2017-10-10 05:02:47"}
{percentage_used: 0.028, datetime: "2017-10-10 17:11:01"}
{percentage_used: 0.029, datetime: "2017-10-11 04:37:42"}
{percentage_used: 0.029, datetime: "2017-10-11 12:49:53"}]

在xAxis标签和放大器中放置一些空间合并重复标签chartjs

0 个答案: