如何解决Kendo React Gauges 不会随着容器大小调整而调整大小
这是我的径向规反应代码。我将高度保持为 100%,但是当我调整容器的大小时,它并没有随之调整大小。我正在使用 react-grid-layout 包来创建可调整大小的小部件。
const radialOptions = {
pointer:{ value: this.state.oee }
}
<div className="d-flex align-items-center unique" style={{ height: "100%" }}>
<RadialGauge
id="guage1"
scale={{
labels: { color: "#a1a8b8" },majorTicks: { color: "#a1a8b8" },minorTicks: { color: "#a1a8b8" },ticksColor: "#a1a8b8"
}}
style={{ width: "50%",height: "100%" }}
{...radialOptions}
/>
<div className="rad-text ml-4">
<p style={{ fontSize: "16px",fontWeight: 600 }}>Title</p>
<h3 className="mt-3">{this.state.data ? this.state.data.toFixed(2) : 0}%</h3>
</div>
</div>
当我检查 DOM 时,它显示了这一点。我什至定位了 div 并添加了样式,但仍然在 DOM 中显示 280px 和 208px,但在样式部分显示 100%,但仪表的高度没有改变。
当容器像这样调整大小但仪表仍然是相同的大小时,还尝试了 Jquery 调整大小。 提前致谢!!
$("#guage1").resize();
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。