如何让Google饼图响应？

Question

我有一个谷歌饼图，它可以正常工作，但它没有响应，如何使其响应？

这是<div>，我正在形成饼图。

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

以下是我的代码的 fiddle 。

Answer 1

以下是使用throttledresize.js的解决方案。

1）将div id="chart_div"放入父div

<div id="chart_wrap">
    <div id="chart_div"></div>
</div>

2）设置这些div的样式

#chart_wrap {
    position: relative;
    padding-bottom: 100%;
    height: 0;
    overflow:hidden;
}

#chart_div {
    position: absolute;
    top: 0;
    left: 0;
    width:100%;
    height:100%;
}

注意：根据您的需要调整CSS。

3）在JS

的末尾添加此代码

$(window).on("throttledresize", function (event) {
    var options = {
        width: '100%',
        height: '100%'
    };

    var data = google.visualization.arrayToDataTable([]);
    drawChart(data, options);
});

Demo on JSFiddle

Answer 2

世界上最简单的方法：

var options = {'width':'auto', 'height':'auto'};