ECharts 饼图放入 flex 容器后消失了?

ECharts Pie Chart disappears when put inside flex container?

提问人:Ole 提问时间:11/15/2023 更新时间:11/15/2023 访问量:29

问:

这个演示渲染了一个 EChart 饼图,当它位于 flex 容器之外时,它渲染得很好。这是标记。

<div style="height: 200px;" echarts (chartInit)="onChartInit($event)" [autoResize]="false" [options]="options"></div>

当演示被放在这样的容器中时,图表的宽度为零并消失。flex

<div style="display:flex;">
       <div style="height: 200px;" echarts (chartInit)="onChartInit($event)" [autoResize]="false" [options]="options"></div>
  </div>

有人知道为什么吗?

javascript html , css, angular echarts

评论

0赞 Matthias Mertens 11/15/2023
文档指出,init 函数应该得到一个“定义了高度和宽度的 DIV 元素”
0赞 Matthias Mertens 11/15/2023
是的,我认为这与 Echarts 无关。只是普通的 div 默认使用全宽,而在 flexbox 中,里面的内容是合适的。由于您最初传递的是空 div,因此它的宽度为 0。您可以通过使用与 flex 容器具有不同背景颜色的空 div 来测试该行为。

答: 暂无答案