如何使用Chart.js在对数刻度X轴上绘制混合图(直方图和折线图)?

时间:2019-06-18 20:54:07

标签: chart.js

我想在画布上绘制直方图和一些线条,X轴为对数刻度。但是,仅显示带有对数刻度X轴的线。

直方图显示,我试图从“ xAxes”属性中删除“对数”类型。但是X轴变为线性。如何在保持对数刻度的X轴的同时显示直方图?

Here is an example of what is expected

感谢您的建议!

// Example Data
// histogramData = [5,10,12,15,19,17,21,6,2,0]
// lineData1 = [{x:150,y:10},{x:332,y:20},{x:542,y:30}...{x:2845,y:100}]

const myChart = new Chart(ctx, {
      type: 'bar',
      data: {
        labels: dataArr,
        datasets: [{
          label: 'Histogram',
          data: histogramData,
        }, {
          label: 'Line 1',
          data: lineData1,
          type: 'line'
        }, {
          label: 'Line 2',
          data: lineData2,
          type: 'line'
        }, {
          label: 'Line 3,
          data: lindData3,
          type: 'line'
        }]
      },
      options: {
        responsive: true,
        maintainAspectRatio: true,
        scales: {
          xAxes: [{
            type: 'logarithmic', // if I comment out this line, histogram graph would show
            ticks: {
              autoSkip: true,
              maxTicksLimit: 6,
              min: 100
              max: 3000
              callback: function (value) {
                  return Number(value.toString());
              },
            },
            // some codes
          }],
          yAxes: [{
            // some codes
          }]
        },
      }
    });

0 个答案:

没有答案