Google Charts legend is not correctly displayed

问题

I am creating google chart and my legend is not being folded into pages.

My code is somthing like

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script>
        google.load("visualization", "1.1", { packages: ["bar", "table"] });
        var chart;
        var table;
        var graphOptions = {
            title: 'Liczba ekspozycji w miesiącu',
            pointSize: 5,
            vAxis: { viewWindowMode: "explicit", viewWindow: { min: 0 } },
            height: '500'
        };
            $(function() {
                chart = new google.charts.Bar(document.getElementById('chart_div'));  
            });
            var maxGraphLines = 50;

            function refreshGraph(data) {
                chart.draw(dataTableForGrap, google.charts.Bar.convertOptions(graphOptions));
            }
        </script>

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

and what I get is:

as you can see the labels for legend are going all the way down even behind the div. They should be paged into pages but this does not happen. Any help will be appreciated. Thanks.

回答1:

The new "material" bar chart does not yet support paging or scrolling of legend items. Until it does, you might try using the corechart ColumnChart with the option { theme: 'material' } to get the material colors and fonts.

来源：https://stackoverflow.com/questions/28460411/google-charts-legend-is-not-correctly-displayed