首页 > 解决方案 > Chartjs 计算图表中的元素

问题描述

图片

我正在尝试获取对象中元素的数量。但是,尽管我在记录数据时可以看到我的数据,但我的图表是空的。我应该如何将数据传递给数据集,还是应该先进行计数?

我的代码

var url = "{{url('myurl') }}";
    var Clinics = new Array();

    $(document).ready(function() {
        $.get(url, function(response) {
           console.log(response)

            response.forEach(function(element) {
                Clinics = element.clinic

            });
            
           var Labels =  ["Paediatric", "Gynaecology Outpatient Clinic", "Physiotherapy Clinic", "Nutrition Clinic", "Dental Clinic", "Optical Clinic", "Well Baby Clinic", "Dermatology Clinic", "Surgical Outpatient Clinic", "Orthopaedic Clinic", "Medical Outpatient Physician", "Comprehensive Care Clinics", "Oncology", "Gastroenterology Clinic", ]
        
            var ctx = document.getElementById("clinicChart").getContext('2d');
            var myChart = new Chart(ctx, {
                type: 'bar',
                data: {
                    labels: Labels,    
                        datasets: [{
                            fillColor: "#79D1CF",
                            strokeColor: "#79D1CF",
                            label: 'Patient Visits',
                            data: Clinics,
                            borderWidth: 1
                        }]
                },
                options: {
                    scales: {
                        yAxes: [{
                            ticks: {
                                beginAtZero:true
                            }
                        }]
                    }
                }
            })
        })
    })

标签: javascriptchart.js

解决方案


您正在覆盖您的Clinics变量。

response.forEach((element) => {
  Clinics.push(element.clinic);
});

推荐阅读