减少条间距chartJS v2答案

【问题标题】：decrease bar spacing chartJS v2减少条间距chartJS v2
【发布时间】：2019-02-26 18:17:08
【问题描述】：

我会画一个间距很小的粗条

实际上，当我减小条形厚度时，条形之间会出现间隙。

我会像照片中那样缩小这种差距

这就是我真正拥有的

var options = {
    responsive: false,
    legend: {
        display: false
    },
    animation: {
        animateScale: true
    },
    scales: {
        xAxes: [{
            barThickness: 45
        }],
        yAxes: [{
            barPercentage: 1,
            categoryPercentage: 1,
            ticks: {
                beginAtZero: true
            }
        }]
    },
    tooltips: {

    }
};
var dataForChart = {
    datasets: [{
        data: [0.2, 0.4, .78, 0.05],
        backgroundColor: ["#FF6384",
            "#4BC0C0",
            "#FFCE56",
            "#36A2EB"
        ],
        borderWidth: 0
    }],
    labels: ['1', '2', '3', '4']
};
var chart = new Chart($("#statsRenderingResultsDeliveryClaimsChart"), {
    type: 'bar',
    data: dataForChart,
    options: options
});

【问题讨论】：

标签： javascript angular chart.js chartjs-2.6.0

【解决方案1】：

有一个图表助手 API，用于存储特定页面的所有图表实例。您可以利用它来确定是否没有任何内容，然后创建逻辑，否则更新逻辑。

请参阅下面的示例。这不是最精炼的逻辑，只是给出一个想法。

 var chartUpdated  = false;

Chart.helpers.each(Chart.instances, function(instance) {
  if (instance.chart.canvas.id === "yourCanvasId") {
    //perform the update logic
    chartUpdated = true;
    return;
  }  
});

if(!chartUpdated)
{
    //perform the create logic
}

【讨论】：