Javascript 如何根据行数设置谷歌图表高度？

我有一个谷歌堆叠条形图，它从数据库中提取数据，并根据所述数据绘制图表。我能够四处搜索，并找到一种基于行数动态设置高度的方法——但对于我的一个搜索过滤器来说，图表看起来太离谱了

下面的代码适用于我的5个过滤器中的4个，但在第5个过滤器中，行数变得更大（大约40-50行）

代码：

生成以下结果。这第一个图像是我的5个过滤器中的4个看起来像什么

第二张图片是有问题的那张，它表明我显然做错了什么

这是什么原因？我如何解决它

编辑：我怀疑我的问题是以下之一：

---

在使用最新的搜索参数刷新页面时，数据行的计数不正确，或者我的div设置和交互方式有问题。我已经尝试过调整

图表高度后面的数学，并删除了填充，似乎无论哪种方式都有相同的效果。我是在正确的轨道上，还是缺少了其他东西？
需要为
高度和
图表区.高度设置选项

        var paddingHeight = 40;
        var rowHeight = data.getNumberOfRows() * 50;
        var chartHeight = rowHeight + paddingHeight;

        var options = {
            titlePosition: 'none',
            width: 1400,

            height: chartHeight,
            chartArea: {
              height: rowHeight,
            },

            legend: { position: 'top', maxLines: 3 },
            bar: { groupWidth: '50%' },
            isStacked: true,
            hAxis: {
                title: 'Business Hours (excluding weekends & holidays)'
            },
            colors: ['#0066ff', '#33cc33', '#ffcc00', '#ff0000'],
            annotations: {
                alwaysOutside: true,
                textStyle: {
                    color: '#000000'
                }
            }
        }

在这里，建议使用
rowHeight
作为
chartArea.height

        var paddingHeight = 40;
        var rowHeight = data.getNumberOfRows() * 50;
        var chartHeight = rowHeight + paddingHeight;

        var options = {
            titlePosition: 'none',
            width: 1400,

            height: chartHeight,
            chartArea: {
              height: rowHeight,
            },

            legend: { position: 'top', maxLines: 3 },
            bar: { groupWidth: '50%' },
            isStacked: true,
            hAxis: {
                title: 'Business Hours (excluding weekends & holidays)'
            },
            colors: ['#0066ff', '#33cc33', '#ffcc00', '#ff0000'],
            annotations: {
                alwaysOutside: true,
                textStyle: {
                    color: '#000000'
                }
            }
        }

您需要为图例、y轴等留出一些空间

chartArea
具有以下属性

top


左侧


高度


宽度

您需要将
top
设置为
20
，或者如果legend在上面的话，也可以设置其他功能。希望这有助于演示……嘿，非常感谢您的快速响应！看起来我很接近，但不知道chartArea选项，所以谢谢你！看起来我可以用
bottom
做一些类似的事情，让我的数字也显示出来，这很好。我还注意到，在我的屏幕截图中，第二张图表将图例错开到第二行-有没有办法解决这一问题，使其始终为一行，而不是分成两行？如果可能，请您简要解释一下在设置高度而不是图表区高度时，我的图表发生了什么？我这样问是因为如果我没有一组足够大的数据来发现这个问题，我可能会以错误的方式处理这个问题，并且可能会在接下来的过程中遇到麻烦。尽管正在设置高度，
chartArea.height
使用了一些默认数字，例如，如果整体
高度
为
100
，并且您想在底部分别为图例和y轴保留
20
，那么您可以设置-->
高度：100
，
chartArea.height:60
，
chartArea.top:20
——默认情况下底部保留
20
——注意：
bottom
没有属性——对于图例行，只需要足够宽，或者尝试使用
legend.maxLines:1
很酷——
bottom
未在配置选项中列出——但添加了，连同
右侧
。。。