如何正确缩放页面上的 Dygraph？

Question

我注意到在启动一个 Dygraph 对象时宽度和高度只能设置为纯整数。我不太确定这是什么衡量标准。当我调整浏览器大小时，它不会缩放。我想将它设置为 height: 70% 而不是 height: 700。这可能吗？

Answer 1

我也遇到了这些问题。我发现调整大小示例也没有太大帮助。

经过几个小时的努力，我确实设法找到了解决方案。所有这些都是让 dygraph 填充父级 div 所必需的，但您（当然）可以将父级宽度从 60% 更改为 60%。

HTML:

<div id="container">
    <div id={this.props.containerId} className="dygraphChart"></div>
</div>

CSS:

#container {
  position: relative;
  width: 60%;
}

.dygraphChart {
  position: absolute;
  left: 1px;
  right: 1px;
  top: 1px;
  bottom: 1px;
  min-width: 100%;
  max-height: 100%;
}

希望对您有所帮助！

如何正确缩放页面上的 Dygraph？

How to scale Dygraph on a page correctly?

dygraphs

reactjs