Question

我在我的Code-Igniter应用程序中使用谷歌图表（饼图）。我在我的仪表板视图页面上显示图表，并且我得到了正确的结果。但是当我检查我的其他页面时，我收到了错误

未捕获（承诺）错误：未定义容器。

错误：

未捕获（在承诺中）错误：未定义容器

at gvjs_3m（jsapi_compiled_default_module.js：66）

在gvjs_9K.gvjs_7p [作为构造函数]   （jsapi_compiled_default_module.js：232）

at gvjs_9K.gvjs_8K [as constructor]（jsapi_compiled_ui_module.js：979）

at new gvjs_9K（jsapi_compiled_ui_module.js：1010）

在drawChart（landlordAdd：648）

在房东添加：623

at

我的图表代码：

<div class="box-body">
    <table class="columns">
        <tr>
            <td>
                <div class="col-md-6" id="piechart_div"></div>
            </td>
            <td>
                <div class="col-md-6" id="donutchart_div"></div>
            </td>
        </tr>
    </table>
</div>

HTML CODE：

{{1}}

我混淆了为什么我在其他网页上收到错误而不是在信息中心上出错？

欢迎任何形式的帮助，提前谢谢。

Answer 1

虽然这可能无法解决您的问题，但是您实际上可以使用const Home = import(/* webpackChunkName: "home" */ 'components/Home/Home');代替 - ＆gt; google.charts.load
默认情况下，$(document).ready将等待文档准备好

推荐一些不同的设置...

google.charts.load

但你需要检查所有页面是否抛出错误，
有一个<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> <script type="text/javascript"> google.charts.load('current', { packages:['corechart'] }).then(function () { $.ajax({ url: "<?php echo base_url().'Dashboard/chartData'; ?>", dataType: "JSON", success:function(result){ drawChart(result); } }); function drawChart(result) { var data = new google.visualization.DataTable(); data.addColumn('string', 'Name'); data.addColumn('number', 'defects'); var dataArray = []; $.each(result, function(i, obj) { dataArray.push([obj.name, parseInt(obj.defects)]); }); data.addRows(dataArray); var piechart_options = { title : 'Defects Registered', width : 500, height: 300, is3D: true, }; var piechart = new google.visualization.PieChart(document.getElementById('piechart_div')); piechart.draw(data, piechart_options); } }); </script>元素，其中包含绘制图表时使用的ID ...

div

替换// check for div with proper id var piechart = new google.visualization.PieChart(document.getElementById('piechart_div'));回调中的硬编码数据，
您发布的代码工作得很好......

请参阅以下工作代码段

error

google.charts.load('current', {
  packages:['corechart']
}).then(function () {
  $.ajax({
    url: "<?php echo base_url().'Dashboard/chartData'; ?>",
    dataType: "JSON",
    success: function(result){
      drawChart(result);
    },
    error: function () {
      var result = [
        {name: 'defect 1', defects: '1'},
        {name: 'defect 2', defects: '2'},
        {name: 'defect 3', defects: '3'},
        {name: 'defect 4', defects: '4'},
        {name: 'defect 5', defects: '5'}
      ];

      drawChart(result);
    }
  });

  function drawChart(result) {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Name');
    data.addColumn('number', 'defects');

    var dataArray = [];

    $.each(result, function(i, obj) {
      dataArray.push([obj.name, parseInt(obj.defects)]);
    });

    data.addRows(dataArray);

    var piechart_options = {
      title : 'Defects Registered',
      width : 500,
      height: 300,
      is3D: true,
    };
    var piechart = new google.visualization.PieChart(document.getElementById('piechart_div'));
    piechart.draw(data, piechart_options);
  }
});

未捕获（在承诺中）错误：未定义容器

1 个答案: