代码之家  ›  专栏  ›  技术社区  ›  Vladyslav Oliinyk

Uncaught TypeError:无法读取空-Chart.js的属性“length”

  •  -1
  • Vladyslav Oliinyk  · 技术社区  · 8 年前
    function createChart(elementID, chartLabels, chartData) {
            var ctx = document.getElementById('"' + elementID + '"');
            var myChart = new Chart(ctx, {
                type: 'bar',
                data: {
                    labels: chartLabels,
                    datasets: [{
                        label: '',
                        data: chartData,
                        borderWidth: 1
                    }]
                },
                options: {
                    scales: {
                        yAxes: [{
                            ticks: {
                                beginAtZero: true
                            }
                        }]
                    }
                }
            });
        }
    
        $(document).ready(function () {
            $.ajax({
                type: 'GET',
                url: '/my-progress/charts-data-load/',
                success: function (data) {
                    $.each(data.data, function (k, v) {
                        let sections = [];
                        let section_total = [];
                        let section_correct = [];
                        let chart_id = v.chart_id;
                        let course = v.course;
                        let chart_data = v.chart_data;
                        $.each(chart_data, function (i, j) {
                            sections.push(j.section);
                            section_total.push(j.section_total);
                            section_correct.push(j.section_correct);
                        });
                        let chart_identifier = 'chart-'+chart_id;
                        $('.charts-wrapper').append(
                            '<div class="col-6">\n' +
                            '    <canvas id="'+chart_identifier+'" width="400" height="400"></canvas>\n' +
                            '</div>'
                        );
                        console.log(sections);
                        console.log(section_total);
                        console.log(section_correct);
                        console.log(chart_identifier);
                        createChart(chart_identifier, sections, section_correct);
                    });
                }
            });
        });
    

    屏幕错误 error

    Chart.js 从这些数据。在日志中你可以看到数据进来了。我为日程画画布。数据被发送到绘制图形的函数。

    2 回复  |  直到 8 年前
        1
  •  0
  •   diouze    8 年前

    var ctx = document.getElementById(elementID) 而不是 var ctx = document.getElementById('"' + elementID + '"')

        2
  •  0
  •   Manish    8 年前

    如果不想使用“labe”或数据集配置的任何其他属性,可以尝试使用以下代码

    var myBarChart = new Chart(ctx, {
        type: 'bar',
        data: data,
        options: options
    });