Chartjs双条形图不能有多个同名属性
Chartjs double bar chart cannot have multiple properties with the same name
我正在尝试使用 Typescript 在 React.js 中绘制双条形图,但是我收到错误 'An object literal cannot have multiple properties with the same name in strict mode'。奇怪的是,错误仅出现在 属性 backgroundColor 上,即使所有其他属性都具有相同的名称。
我试图在我的 tsconfig、json 文件中将 'strict' 设置为 false,但是当我使用 npm start 时,它被设置回 true 并显示消息:
The following changes are being made to your tsconfig.json file:
- compilerOptions.strict to be suggested value: true (this can be changed)
这是我用来在 chart.js
中设置图表选项的代码
datasets: [
{
label: "Surveys Started",
backgroundColor: gradientFill,
borderColor: "#f96332",
pointBorderColor: "#FFF",
pointBackgroundColor: "#FFF",
backgroundColor: '#FF3333',
pointBorderWidth: 2,
pointHoverRadius: 4,
pointHoverBorderWidth: 1,
pointRadius: 4,
fill: true,
borderWidth: 1,
data: this.state.data[0]
},
{
label: "Surveys Completed",
backgroundColor: gradientFill,
pointBackgroundColor: "#2CA8FF",
backgroundColor: '#3733FF',
pointBorderWidth: 2,
pointHoverRadius: 4,
pointHoverBorderWidth: 1,
pointRadius: 4,
fill: true,
borderWidth: 1,
data: this.state.data[1]
}
看起来 gradientFill
变量本身有问题。
注释掉gradientFill
变量,用字符串设置backgroundColor
(例如'#fff'
),看看错误是否消失。如果是,则审查 gradientFill
.
的实施
我正在尝试使用 Typescript 在 React.js 中绘制双条形图,但是我收到错误 'An object literal cannot have multiple properties with the same name in strict mode'。奇怪的是,错误仅出现在 属性 backgroundColor 上,即使所有其他属性都具有相同的名称。
我试图在我的 tsconfig、json 文件中将 'strict' 设置为 false,但是当我使用 npm start 时,它被设置回 true 并显示消息:
The following changes are being made to your tsconfig.json file:
- compilerOptions.strict to be suggested value: true (this can be changed)
这是我用来在 chart.js
中设置图表选项的代码datasets: [
{
label: "Surveys Started",
backgroundColor: gradientFill,
borderColor: "#f96332",
pointBorderColor: "#FFF",
pointBackgroundColor: "#FFF",
backgroundColor: '#FF3333',
pointBorderWidth: 2,
pointHoverRadius: 4,
pointHoverBorderWidth: 1,
pointRadius: 4,
fill: true,
borderWidth: 1,
data: this.state.data[0]
},
{
label: "Surveys Completed",
backgroundColor: gradientFill,
pointBackgroundColor: "#2CA8FF",
backgroundColor: '#3733FF',
pointBorderWidth: 2,
pointHoverRadius: 4,
pointHoverBorderWidth: 1,
pointRadius: 4,
fill: true,
borderWidth: 1,
data: this.state.data[1]
}
看起来 gradientFill
变量本身有问题。
注释掉gradientFill
变量,用字符串设置backgroundColor
(例如'#fff'
),看看错误是否消失。如果是,则审查 gradientFill
.