# 混合图表类型

¥Mixed Chart Types

使用 Chart.js，可以创建由两种或多种不同图表类型组合而成的混合图表。一个常见的例子是一个柱状图，它也包含一个线数据集。

¥With Chart.js, it is possible to create mixed charts that are a combination of two or more different chart types. A common example is a bar chart that also includes a line dataset.

创建混合图表时，我们在每个数据集上指定图表类型。

¥When creating a mixed chart, we specify the chart type on each dataset.

const mixedChart = new Chart(ctx, {
    data: {
        datasets: [{
            type: 'bar',
            label: 'Bar Dataset',
            data: [10, 20, 30, 40]
        }, {
            type: 'line',
            label: 'Line Dataset',
            data: [50, 50, 50, 50],
        }],
        labels: ['January', 'February', 'March', 'April']
    },
    options: options
});

在这一点上，我们有一个图表渲染我们想要的方式。请务必注意，图表的默认选项仅在数据集级别考虑，在这种情况下不会在图表级别合并。

¥At this point, we have a chart rendering how we'd like. It's important to note that the default options for the charts are only considered at the dataset level and are not merged at the chart level in this case.

const config = {
  type: 'scatter',
  data: data,
  options: {
    scales: {
      y: {
        beginAtZero: true
      }
    }
  }
};const config = {
  type: 'scatter',
  data: data,
  options: {
    scales: {
      y: {
        beginAtZero: true
      }
    }
  }
};

# 绘图顺序

¥Drawing order

默认情况下，绘制数据集时第一个位于最顶层。这可以通过为数据集指定 order 选项来改变。order 默认为 0。请注意，这也会影响堆叠、图例和工具提示。所以它与重新排序数据集本质上是一样的。

¥By default, datasets are drawn such that the first one is top-most. This can be altered by specifying order option to datasets. order defaults to 0. Note that this also affects stacking, legend, and tooltip. So it's essentially the same as reordering the datasets.

order 属性的行为类似于权重而不是特定顺序，因此数字越大，该数据集在画布上绘制的速度就越快，因此其他具有较低阶数的数据集将被绘制在它上面。

¥The order property behaves like a weight instead of a specific order, so the higher the number, the sooner that dataset is drawn on the canvas and thus other datasets with a lower order number will get drawn over it.

const mixedChart = new Chart(ctx, {
   type: 'bar',
   data: {
       datasets: [{
           label: 'Bar Dataset',
           data: [10, 20, 30, 40],
           // this dataset is drawn below
           order: 2
       }, {
           label: 'Line Dataset',
           data: [10, 10, 10, 10],
           type: 'line',
           // this dataset is drawn on top
           order: 1
       }],
       labels: ['January', 'February', 'March', 'April']
   },
   options: options
});