javascript - 图表 js 仅在积极数据时显示

标签 javascript chart.js

我对图表 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 并在选项中打勾。

谢谢

最佳答案

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

scaleBeginAtZero: false

关于javascript - 图表 js 仅在积极数据时显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53264138/

相关文章:

javascript - 如何使用 Chart.js 按颜色填充图表直至垂直线

javascript - 图表工作不正确 chart.js

javascript - 选择特定下拉项时使用 jQuery JSON 函数填充文本区域

javascript - 点击缩放时的markerClusterer

javascript - 如何删除 Chart.js 中图例文本旁边的矩形框

javascript - 当 X 轴为时间时,堆积折线图无法正确显示

javascript - <head> 使用浏览器打开时不加载脚本

javascript - 使用 Highcharts.js 的可拖动日期范围

javascript - 在 IE7 中绝对位置 div 位于文本框后面

webpack - 如何将 Aurelia JSPM 插件与 WebPack 结合使用