Третий фрагмент данных не будет отображаться в гистограмме с накопленной группой (ChartJs) - PullRequest
0 голосов
/ 11 октября 2019

Я использую ChartJs для создания гистограммы с накоплением группы . На этом графике я предполагаю отображать 3 элемента данных. Тем не менее, он отображает только 2. Я предоставил свой сценарий ниже. Может ли кто-нибудь взглянуть на это и посмотреть, что может быть не так?

Вот репозиторий chartjs github , которым я следовал.

 $(function () {
     new Chart(document.getElementById("stacked_group_bar_chart").getContext("2d"), getChartJs('stackedgroup'))
     new Chart(document.getElementById("line_chart").getContext("2d"), getChartJs('line'));
    });

    function getChartJs(type) {
    var config = null;
     if (type === 'line') {
            config = {
                type: 'line',
                data: {
                    labels: ["January", "February", "March", "April", "May"],
                    datasets: [{
                        label: "Refund",
                        data: [65, 59, 80, 45, 56],
                        borderColor: 'rgba(0, 188, 212, 0.75)',
                        backgroundColor: 'rgba(0, 188, 212, 0.3)',
                        pointBorderColor: 'rgba(0, 188, 212, 0)',
                        pointBackgroundColor: 'rgba(0, 188, 212, 0.9)',
                        pointBorderWidth: 1
                    }
                    ]
                },
                options: {
                    responsive: true,
                    legend: false
                }

            }
        }

        else if (type === 'stackedgroup') {
            config = {
                type: 'bar',
                data: {
                    labels: ["January", "February", "March", "April", "May", "June", "July"],
                    datasets: [{
                        label: "My First dataset",
                        data: [65, 59, 80, 81, 56, 55, 40],
                        backgroundColor: 'rgba(0, 188, 212, 0.8)',
                        stack: 'Stack 0'
                    }, {
                        label: "My Second dataset",
                        data: [28, 48, 40, 19, 86, 27, 90],
                        backgroundColor: 'rgba(233, 30, 99, 0.8)',
                        stack: 'Stack 0'
                    }, {
                        label: "My Third dataset",
                        data: [28, 48, 40, 19, 86, 27, 90],
                        backgroundColor: 'rgba(233, 30, 99, 0.8)',
                        stack: 'Stack 1'
                      }]
                },
                options: {
                    responsive: true,
                    legend: false,
                    tooltips: {
                        mode: 'index',
                        intersect: false
                    },
                    scales: {
                        xAxes: [{ stacked: true }],
                        yAxes: [{ stacked: true }]
                    }
                }
            }
        }
    return config;
    }
...