简体   繁体   中英

chart.js first bar is not showing

My first bar is not showing.

My html:

<div class="card-body">
                <canvas id="canvasContratsIBS"></canvas>
            </div>

My js:

var barContratsIBS = {
    labels: ['Marché A', 'Marché B', 'Marché C'],
    datasets: [{
        label: 'Les études d’exécution',
        backgroundColor: '#660066',
        data: [3, 10, 8],
    }, {
        label: 'Les études de fabrication, l’approvisionnement et la fabrication',
        backgroundColor: '#660066',
        data: [3, 10, 8],
    }, {
        label: 'La livraison et le montage sur site',
        backgroundColor: '#660066',
        data: [3, 10, 8],
    }]
};

Result:截屏

To solve it, I scale the y axis to min value 0:

<script>
var barContratsIBS = {
    labels: ['Marché A', 'Marché B', 'Marché C'],
    datasets: [{
        label: 'Les études d’exécution',
        backgroundColor: '#660066',
        data: [7, 10, 8]
    }, {
        label: 'Les études de fabrication, l’approvisionnement et la fabrication',
        backgroundColor: '#660066',
        data: [5, 10, 8]
    }, {
        label: 'La livraison et le montage sur site',
        backgroundColor: '#660066',
        data: [6, 10, 8]
    }]
};

var _options = {
    scales: {
        yAxes: [{
            ticks: {
                suggestedMin: 0
            }
        }]
    }
};

var ctxContratsIBS = document.getElementById("canvasContratsIBS");
var myBarChart = new Chart(ctxContratsIBS, {
    type: 'bar',
    data: barContratsIBS,
    options: _options
});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM