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

标签 javascript google-visualization

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

但是,如果我将图例移到底部,图例将不再换行,而是提供类别的分页 View 。这与图例位于顶部且 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, 20, 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);
    }

最佳答案

呃...刚在 Google 的网站上找到这个:

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

关于javascript - maxLines 选项是否不适用于底部 Stacked Bar Google Chart 上的图例?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31795612/

相关文章:

javascript - D3 : gauge chart with growing arc

javascript - 通过 Ajax 加载 Google 可视化

javascript - XMLHttpRequest 未发送 'Via'

javascript - html mustache js 内的模板

javascript - 用于将字符填充到字符串末尾的jquery函数

javascript - 我如何才能在两行中显示每行不同字体大小的标题?

google-visualization - Google图表/图表的列宽

javascript - 谷歌图表不适用于 Wkhtmltopdf

javascript - 谷歌图表量规

javascript - .click 中的 jQuery .submit( [callback] ) 不起作用