谷歌可视化图表，百分比大小 [英] google visualization chart, size in percentage

问题描述

你如何设置谷歌图表的大小以百分比为单位：
我在html中有这个：

 < div id =chart_divwidth =90％height =20％>< / div> 
  

并且没有宽度和高度在js中的选项。

但是图表大小不适应视口。

谢谢

解决方案

首先，使用样式来设置您的维度，而不是属性：

 < div id = chart_divstyle =width：90％; height：20％;>< / div> 
  

默认情况下，图表会绘制div的大小，但图表无法响应。您必须将调整大小事件处理程序挂接到重新绘制图表的窗口（或其他元素，如果您在窗口中调整大小）：

  function resizeChart（）{
 chart.draw（data，options）; 
 
 if（document.addEventListener）{
 window.addEventListener（'resize'，resizeChart）; 
 
 else if（document.attachEvent）{
 window.attachEvent（'onresize'，resizeChart）; 
} 
 else {
 window.resize = resizeChart; 
} 
  

How do you set the size of a google chart in percentage : I have this in the html:

<div id="chart_div" width="90%" height="20%"></div>

and no width nor height in the options in the js.

But the chart size doesn't adapt to the viewport.

Thanks

解决方案

First, use styles to set your dimensions, not attributes:

<div id="chart_div" style="width: 90%; height: 20%;"></div>

The chart will draw to the size of the div by default, but the charts are not responsive. You have to hook a "resize" event handler to the window (or other element if you are resizing within a window) that redraws the chart:

function resizeChart () {
    chart.draw(data, options);
}
if (document.addEventListener) {
    window.addEventListener('resize', resizeChart);
}
else if (document.attachEvent) {
    window.attachEvent('onresize', resizeChart);
}
else {
    window.resize = resizeChart;
}

这篇关于谷歌可视化图表，百分比大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！