javascript - Chart.js 条形重叠
问题描述
我尝试从 chart.js 条码中调整、添加、减去,但我得到重叠条,如您所见:
代码:
fetch("/Ajax").then(response => response.json()).then(function (response) {
if (response == null) {
console.log(response);
} else {
console.log(response);
const config = {
type: 'bar',
data: {
labels: chart_labels,
datasets: [{
label: "My First dataset",
fill: true,
backgroundColor: gradientStroke,
borderColor: '#d346b1',
borderWidth: 2,
borderDash: [],
borderDashOffset: 0.0,
pointBackgroundColor: '#d346b1',
pointBorderColor: 'rgba(255,255,255,0)',
pointHoverBackgroundColor: '#d346b1',
pointBorderWidth: 20,
pointHoverRadius: 4,
pointHoverBorderWidth: 15,
pointRadius: 4,
data: response
}]
},
options: gradientChartOptionsConfigurationWithTooltipPurple
};
var dtx = document.getElementById("chartBig1").getContext("2d");
var myChartData = new Chart(dtx, config);
$("#0").click(function() {
var data = response;
data.datasets[0].data = response;
data.labels = response;//['9','10','11','12','1','2','3','4','5','6','7','8','9','10','11','12'];
myChartData.update();
});
我不确定如何使条形彼此分开。
解决方案
推荐阅读
- go - 空嵌套结构
- c# - 运行 .NET Core API 项目会出现错误 502.5 - 进程失败
- java - Java webapp如何在内网发布其DNS名称
- client - HBase - 将 Java 客户端从 Eclipse 连接到 EC2 实例上的 HBase 时出错
- react-native - 在调试模式下工作时反应本机胜利图表在发布模式下不工作
- javascript - 在按钮单击时以 4 角滚动 div
- email - Magento - 在交易电子邮件中显示两种付款方式的某些文本
- vba - VBA - 循环行并根据条件插入值
- node.js - 如何从无服务器 cli 设置 Cloudformation 完全访问权限
- php - WooCommerce 如何从 wp_woocommerce 表中选择正确的商品数据