代码之家  ›  专栏  ›  技术社区  ›  Harshith Rai

获取错误:线形图不是构造函数,并且图表未显示在网页中

  •  1
  • Harshith Rai  · 技术社区  · 6 年前

    google.charts.load('current', {'packages':['line']}); google.charts.setOnLoadCallback($scope.drawChart);

    未捕获(承诺中)类型错误:google.visualization.line图表不是构造函数 在$范围图

    $scope.drawChart = function() {
    
        var finaldata = [[{label:'Process', type: 'string'}, {label: 'NumOfNewAssociations', type: 'number'}, {label: 'NumOfClosedAssociations', type: 'number'}, {label: 'NumOfSavedImages', type: 'number'}, {label: 'SizeOfSavedImagesInBytes', type: 'number'}]];
        for (var i = 1; i < 2/*$scope.storestats2.length*/; i++) {
            finaldata[i] = [$scope.storestats2.Process, $scope.storestats2.NumOfNewAssociations, $scope.storestats2.NumOfClosedAssociations, $scope.storestats2.NumOfSavedImages, $scope.storestats2.SizeOfSavedImagesInBytes];
        }
    
        var data = google.visualization.arrayToDataTable(finaldata);
        var options = {
            chart: {
                title: 'Range-wise Store statistics',
                subtitle: 'in the last 30 minutes'
            },
            width: 900,
            height: 500
        };
        var chart = new google.visualization.LineChart(document.getElementById('linechart_material'));
        chart.draw(data, google.charts.Line.convertOptions(options));
    };
    

    我甚至尝试在HTML文件中包含以下内容:

    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    

    <div id="linechart_material" style="width: 900px; height: 500px"></div>
    

    我也可以看到空间分配在网页上,但从来没有显示在它。 除此之外,其他所有函数都工作得很好。我甚至试着只做一张图表。还是一样。但是当我把它作为一个单独的HTML文件,嵌入JS控制器和其他本地定义的数组时,代码工作得很好。但我无法让它在我的上下文中工作,因为它必须在不同的文件中。

    1 回复  |  直到 6 年前
        1
  •  1
  •   Harshith Rai    6 年前

    我无意中找到了解决这个问题的办法。但我还是不知道它是怎么解决的,为什么。

    我所要做的就是只修改一行代码:

    我必须改变:

    var chart = new google.visualization.LineChart(document.getElementById('linechart_material'));
    

    进入之内

    var chart = new google.charts.Line(document.getElementById('linechart_material'));