不要显示图表但是生成

时间:2017-11-20 12:43:03

标签: javascript jquery ajax google-visualization

通过调用ajax显示饼图。调用ajax工作,当我检查页面时,我看到有很多东西的div,即它不是空的。

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
google.charts.load('current', {
  'packages': ['corechart', 'bar', 'table'],
  'language': 'es',
  callback: function() {
    $("#formDiarioango").submit(drawChart);
  }
});

function drawChart(event) {
  event.preventDefault();

  // viene la petición ajax
  $.ajax({
    url: $(this).attr('action'),
    type: 'post',
    data: $(this).serialize(),
    dataType: "json",
    success: function(rta) {

      // material en el mes
      var data = google.visualization.arrayToDataTable([
        ['Material', 'cantidad'],
        ['Organico', rta.tipoMateriales["organico"]],
        ['Reciclable', rta.tipoMateriales["reciclable"]],
        ['No aprovechable', rta.tipoMateriales["noAprovechable"]]
      ]);

      var options = {
        title: 'Tipo de materiales recolectados (Kg) en el mes'
      };
      var chart = new google.visualization.PieChart(document.getElementById('tipo_material_mes'));
      chart.draw(data, options);
    }
  });
}

在使用ajax调用之前div是空的,它在调用之后有内容,但是除了图形的标题之外没有显示任何内容,并且检查代码内部有某些内容[如附图中所示]。

enter image description here

但是网页没有显示图表,而是显示我放在它上面的标题

有些想法,建议解决我的问题我将非常感激。对不起我的英文

0 个答案:

没有答案