Функция Javascript window.onload не загружается для нескольких графиков с Chart.js

Question

Я использую Chart.js для отображения некоторых диаграмм. Когда я использую функцию onload для круговой диаграммы, она корректно загружается на страницу, когда я добавляю вторую переменную onload для гистограммы, ничего не отображается.

Мой код JavaScript выглядит так

    var config = {
    type: 'pie',
    data: {
        datasets: [
            {
        data : [10, 30, 40, 50],
        backgroundColor: [
                "#F7464A",
                "#46BFBD",
                "#FDB45C",
                "#949FB1",
                "#65b13b",

            ],
        }],
        labels: ["4G", "5G", "Mano"],
    },
        options: {
        responsive: true
    }
};

var barChartData = {
    type: 'bar',
    labels: ["January", "February", "March", "April", "May", "June", "July"],
    datasets: [
            {
                fillColor: "rgba(220,220,220,0.5)",
                strokeColor: "rgba(220,220,220,1)",
                data: [65, 59, 90, 81, 56, 55, 40]
            },
            {
                fillColor: "rgba(151,187,205,0.5)",
                strokeColor: "rgba(151,187,205,1)",
                data: [28, 48, 40, 19, 96, 27, 100]
            }
        ]
    options: {
        responsive: true

    },

};

window.onload = function() {
    var ctx = document.getElementById("pie-chart").getContext("2d");
    window.myPie = new Chart(ctx, config);
};
    var bctx = document.getElementById("bar-chart").getContext("2d");
    window.myBar = new Chart(bctx, barChartData);
};

Мой HTML-код выглядит так:

<canvas id="bar-chart" class="chart-holder" height="250" width="538"></canvas>
<canvas id="pie-chart" class="chart-holder" height="250" width="538"></canvas>

Я смотрел на другие решения, но все они очень сложны, и я чувствую, что это всего лишь что-то простое.

Answer 1

Код bar-chart находится вне функции window.onload. Поместите это в функцию window.onload:

window.onload = function() {
    var ctx = document.getElementById("pie-chart").getContext("2d");
    window.myPie = new Chart(ctx, config);

    var bctx = document.getElementById("bar-chart").getContext("2d");
    window.myBar = new Chart(bctx, barChartData);
};