谷歌地图Javascript API-图例最大高度

我正在使用GoogleMapsJavaScriptAPI显示一张地图，并创建了一个自定义图例来打开和关闭某些地图路径/标记。图例中的数据是由PHP使用数据库中的条目加载的，因此我无法控制将出现多少复选框。目前，legend div根据需要进行扩展，以适应需要的复选框，但我希望阻止它扩展到地图的范围之外

此时，我的图例显示如下：

当我向上移动浏览器底部以降低屏幕高度时，它会将div绘制到屏幕底部之外：

有人知道如何告诉div不要垂直扩展到地图边缘之外吗？很明显，我可以根据地图的高度设置一个最大高度值，减去图例div的顶部位置，但我正在寻找一个更自然的值，可能是沿着

map.controls[google.maps.ControlPosition.LEFT_top].push（document.getElementById（'mapLegend'））的路线但用于设置最底部的值？这样，即使在移动或小屏幕上，地图也可以根据需要进行调整（如在第二个屏幕截图中，谷歌徽标显示在图例上方）

我知道这是一个非常开放的问题，但我非常感谢任何人能给予我的帮助或指点

提前感谢。
我最终使用CSS
calc
功能根据屏幕大小手动设置图例的最大高度

    .mapLegend {
        height: auto;
        max-height: calc(100vh - 175px);       /* Top bar, plus height of Google logo at bottom, plus absolute top position of Legend div, plus buffer */
    }

    @media (max-height: 269px) {
        .mapLegend {
            height: auto;
            max-height: calc(100vh - 120px);    /* When screen <270px tall, some Google Maps controls are hidden, so legend moves up, so can expand further down the bottom */
        }
    }

.mapLegend{
高度：自动；
最大高度：计算（100vh-175px）；/*顶部栏，加上底部谷歌徽标的高度，加上图例div的绝对顶部位置，加上缓冲区*/
}
@介质（最大高度：269px）{
梅普根德先生{
高度：自动；
最大高度：计算（100vh-120px）/*什么时候屏幕上可以请您提供一个示例演示给我们给您一个答案？@rafon谢谢您的评论，我在寻找一些一般的指针，或者希望有人知道一个函数可以实现我的目标，因为我还没有编写任何代码来实现我的目标，并且正在寻找最佳的起点。谢谢anway。