谷歌饼图不响应答案

【问题标题】：Google Pie Chart Is Not Responsive谷歌饼图不响应
【发布时间】：2017-10-03 08:09:59
【问题描述】：

我正在尝试使我的图表具有响应性。我已添加此代码（如下所示）以使我的图表响应。但它仍然无法正常工作。有人可以帮我弄清楚吗？谢谢。

<script type="text/javascript"> 

google.charts.load('current', {'packages':['corechart']}); 
google.charts.setOnLoadCallback(drawChart); 
   
function drawChart() { 
  var jsonData = $.ajax({ 
      url: "<?php echo base_url() . 'index.php/main/lihat_graph' ?>", 
      dataType: "json", 
      async: false 
      }).responseText; 
       
  var data = new google.visualization.DataTable(jsonData);

  var options = {
    title:    '',
    hAxis:    {title: 'Jumlah Kepakaran'},
    vAxis:    {title: 'Jumlah Kepakaran'},
    bubble:   {textStyle: { fontName: 'arial', fontSize: 12 }},
    colors:   ['beige','pink','#00ADF9', 'maroon', 'red', 'green', 'purple', 'gray', 'orange']
  };

  if(data.getNumberOfRows() == 0){
    $("#chart_div").append("Graf Bidang Kepakaran masih dalam proses 
    pengumpulan data. Graf akan dipaparkan setelah proses pengumpulan data 
    selesai.")
  }else{
   var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
   chart.draw(data, options);        
  }
} 


$(window).resize(function(){
  drawChart();
});
</script>

Graph 是我图表的图像。

【问题讨论】：

标签： javascript jquery chart.js google-visualization

【解决方案1】：

您的宽度始终为 800。将其调整为窗口大小并进行数学运算以使其根据需要嵌套在您的盒子中。

width : window.innerWidth,

查看此链接并编写更好的代码。你写的方式有性能问题。 JQuery: How to call RESIZE event only once it's FINISHED resizing?

【讨论】：

现在我在没有设置宽度和高度的情况下调整我的代码。但我仍然使用 .resize 函数。我处理我的代码。但问题是我的图表看起来太小，我什至无法阅读标签。你可以在这里查看我的图表 -> smkphp.ukm.my/domainexpert
现在我的图变小了，不像我想要的那样。
请创建一个小提琴。