如何通过遍历数组填充具有多个数据集的ChartJS

时间:2019-04-21 01:03:50

标签: javascript jquery chart.js laravel-5.7

我试图弄清楚如何用来自数组的多个数据集填充ChartJS。

这是我的ChartJS代码:

var ctx = document.getElementById("myAreaChart");
var myLineChart = new Chart(ctx, {
    responsive: true,
    type: 'bar',
    data: {
        labels: response.months,
        datasets: [{
            label: 'Marilag Rice',
            lineTension: 0.3,
            backgroundColor: "rgba(189, 183, 107, 1)",
            borderColor: "rgba(102, 51, 0, 1)",
            pointRadius: 5,
            pointBackgroundColor: "rgba(2,117,216,1)",
            pointBorderColor: "rgba(102, 51, 0, 1)",
            pointHoverRadius: 5,
            pointHoverBackgroundColor: "rgba(2,117,216,1)",
            pointHitRadius: 20,
            pointBorderWidth: 2,
            data: ['123', '45']
        }],
    },
    options: {
        scales: {
            xAxes: [{
                time: {
                    unit: 'date'
                },
                gridLines: {
                    display: true
                },
                ticks: {
                    maxTicksLimit: 10
                }
            }],
            yAxes: [{
                ticks: {
                    min: 0,
                    max: response.max, // The response got from the ajax request containing max limit for y axis
                    //max: 4,
                    maxTicksLimit: 10
                },
                gridLines: {
                    color: "rgba(0, 0, 0, .125)",
                },
                scaleLabel: {
                    display: true,
                    labelString: 'Count of Closed Sales'
                }
            }],
        },
        legend: {
            display: true
        }
    }
});

这是我想在图表内循环的数组:

{"months":["Mar","Apr"],"data":[{"Marilag Rice Mill":11,"Marilag Feed Mill":4,"Enzo-Erwan Piggery Farm":6},{"Marilag Rice Mill":9,"Marilag Feed Mill":0,"Enzo-Erwan Piggery Farm":1}]}

我能够获取月份,但无法获取数据,这应该是多个数据集。

此图表的目标是显示来自不同业务部门的数据集:Marilag Rice Mill,Marilag Feed Mill,Enzo-Erwan Piggery Farm,但它必须能够将新业务部门的数据显示为

0 个答案:

没有答案