之前文章中的示例代码中实例化chart类使用的如下代码，主要使用的参数包括页面中canvas元素，绘图类型、数据、参数。
var barChart = new Chart(ctx, {
type: 'line',
data: data,
options:{
responsive:false
}
});
从chart类的定义来看，构造函数中主要包括两类参数：canvas元素（item）和用户配置（userConfig）。根据参考文献1-2，有多种方式定位canvas元素，也即参数1的形式有很多种：canvas元素、canvas元素绘图上下文、canvas元素名称、jQuery实例。在构造函数中，调用getCanvas函数根据参数1获取canvas元素。
class Chart {
constructor(item, userConfig) {
const me = this;
const config = this.config = new Config(userConfig);
const initialCanvas = getCanvas(item);
...
...
...
function getCanvas(item) {
if (_isDomSupported() && typeof item === 'string') {
item = document.getElementById(item);
} else if (item && item.length) {
item = item[0];
}
if (item && item.canvas) {
item = item.canvas;
}
return item;
}
构造函数的第二个参数（Config类型）保存绘图类型（type）、数据（data）和配置（options）：
1）type用于指定绘图类型，字符串类型，目前chart.js可以绘制的图形主要包括以下几种（截图来自参考文献1-2，便于中英文对照）：
2）data保存绘图所需的数据及参数，主要包括labels、datasets。datasets属于集合对象，集合中的每个对象都对应一类图形数据（如折线图中的一条折线、柱状图中的一类图形等），每类图形数据中包括图形名称、数据及其它设置（如前面文章中提到的张力、是否显示线条等），其代码形式如下所示：
datasets: [{
label: '折线1',
data: [65, 59, 80, 81, 56, 55, 40],
fill: false,
borderColor: 'rgb(75, 192, 192)',
tension: 0,
showLine:true
},
{
label: '折线2',
data: [85, 79, 100, 101, 76, 75, 60],
fill: false,
borderColor: 'rgb(175, 92, 92)',
tension: 0,
showLine:true
}]
};
labels用于设置坐标系中索引轴（一般为x轴）上显示的信息，是一个字符串或数值型数组，其长度应与datasets集合中所有对象中的数据属性中的最大长度保持一致，否则图表图形会显示不全。如下图所示，左侧为正常显示的图形，总共7个数据，x轴显示7个标签，但如果labels长度为2，则仅显示2个点的图形（右图所示）。
3）options保存图表的全局配置，采用命名空间形式记录不同对象的配置值，如布局、标题、动画、提示等。在chart类的构造函数中赋值时，采用嵌套形式，如下列代码所示。详细的选项命名空间及属性说明请见参考文献1-2。后续会慢慢学习并使用这些属性。
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
}
[1]https://chartjs.bootcss.com/docs/
[2]https://www.chartjs.org/docs/latest/charts/line.html#line-styling
[3]https://blog.csdn.net/qq_25652949/article/details/82735658