javascript - float 图调整大小错误，高度无效

Question

我正在尝试将 float 图表添加到我的页面，但我在向图表添加调整大小时遇到​​了一些问题。要使调整大小插件工作，宽度和高度 og 占位符 div 需要设置为 100%。但是当我这样做并想在新窗口中加载图形时，我尝试在 doc ready 上调用 plot 方法但是我的 div 的高度是 0 althoug containing div har height = 600px(所以占位符 div 应该相同吗？ ).

 <div id ="ResizableContainer" class="ui-widget-content" style="width:900px;height:600px;">
    <div id="placeholderForGraph" class="graph-placeholder" ></div>
</div>

我的.css:

.graph-placeholder {
    width: 100%;
    height: 100%;
    font-size: 14px;
    line-height: 1.2em;
    padding: 0; 
    position: relative;
}

我的.js

$("#placeholderForGraph").text('');
$("#ResizableContainer").show();
$("#placeholderForGraph").plot([data], options);<- error

错误:绘图的尺寸无效，宽度 = 900，高度 = 0

如果您在调用 plot 之前设置了高度，图形将不会调整高度如何在不破坏调整大小功能的情况下向 div 添加高度？

提前致谢!

Answer 1

将 .graph-placeholder 的 min-height 设置为一些合理的绝对值，例如 100px。

我还建议为可调整大小的容器设置最小值和最大值(参见 here)。