微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

javascript – maxLines选项是否不适用于底部的Stacked Bar Google Chart上的图例?

我正在实施Stacked Bar Google Chart.我发现当我的类别跨越多行并且图例位于顶部时,图例将换行到多行,由hAxis变量上的maxLines选项控制.

但是,如果我将图例移动到底部,则图例不再包装,而是提供类别的分页视图.当图例位于顶部且maxLines选项设置为1时,这是相同的行为.

这是我的fiddle.顶部的图表顶部是传说,底部的图例顶部是传说……我这样做是为了让它变得简单……

google.load('visualization','1',{packages: ['corechart','bar']});
google.setonLoadCallback(drawBasic);

function drawBasic() {

      var data = google.visualization.arrayToDataTable([
        ['Genre','Fantasy & Sci Fi','Romance','Mystery/Crime','General','Western','Literature',{ role: 'annotation' } ],['2010',10,20,30,15,5,''],]);

      var options = {
        width: 550,height: 160,chartArea: {height: '45%' },legend: { position: 'top',maxLines: 3 },bar: { groupWidth: '55%' },hAxis: { maxValue: 100,ticks: [0,25,50,75,100] },isstacked: true
      };

      var chart = new google.visualization.BarChart(document.getElementById('chart_div'));

      chart.draw(data,options);

      var chart2 = new google.visualization.BarChart(document.getElementById('chart2_div'));
    options.legend.position = "bottom";
      chart2.draw(data,options);
    }

解决方法

呃……刚刚在谷歌的网站上找到了这个:

Maximum number of lines in the legend. Set this to a number greater
than one to add lines to your legend. Note: The exact logic used to
determine the actual number of lines rendered is still in flux.

This option currently works only when legend.position is ‘top’.

Type: number Default: 1

https://developers.google.com/chart/interactive/docs/gallery/linechart

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐