Question

我对图表js栏有问题。这是选项：

trendChart = new Chart(ctx, {
    type: 'bar',
    data: {
        labels: dynamicLabels,
        datasets: [{
            label: label1,
            data: displayedDatas1,
            borderColor: colors,
            backgroundColor: colors,
            fill: false,
            borderWidth: 2
        }]
    },
    options: {
        showDatapoints: true,
        tooltips: {
            callbacks: {
                label: function (tooltipItem, data) {
                    return data['datasets'][0]['data'][tooltipItem['index']] + ' %';
                }
            }
        },
        maintainAspectRatio: false,
        legend: {
            display: false
        },
        emptyOverlay: {                             // enabled by default
            fillStyle: 'rgba(105,105,105,0.4)',     // Change the color of the overlay to grey with a 40% alpha
            fontColor: 'rgba(47,47,47,1.0)',     // Change the text color to white
            fontStroke: 'rgba(47,47,47,0)',     // Change the text color to white
            fontSize: $(window).width() > 1007 ? 25 : 15,
            message: "Veuillez sélectionner vos activités et services, et choisissez une période",
            fontStrokeWidth: 0                      // Hide the stroke around the text                
        }
    }
});

以及我如何更新数据：

trendChart.data.datasets[0] = {
    label: label1,
    data: displayedDatas1,
    borderColor: colors,
    backgroundColor: colors,
    fill: false,
    borderWidth: 2
};
trendChart.data.labels = dynamicLabels;
trendChart.update();

问题是，当我只有负数数据时，条形图不会显示，但是当至少有一个正数数据时，它们会神奇地出现。

我已经尝试过：scaleBeginAtZero并在选项中打勾。

谢谢

Answer 1

尝试将scaleBeginAtZero: false添加到options对象中。

scaleBeginAtZero: false

Answer 2

找到了！

问题出在插件上：chartjs-plugin-empty-overlay.js。禁用它时，将显示负值。应该已经阅读了该文档，该文档仅针对折线图进行了测试。

图表JS仅显示正数数据

2 个答案: