如何使 GoogleChart 在 mat-grid 中灵活？

Question

我在 mat-grid 列表中有 google 图表，这是我为 page.But 上的元素对齐生成的，当我更改浏览器的宽度时，图表不会变小，因为 [=23] =] 在网格平铺中溢出而不是 good.Usually 所有图像、文本等在垫网格中都是灵活的，但我不明白为什么这不适用于 google 图表。

演示： https://stackblitz.com/edit/angular-pt2kha?file=app/grid-list-overview-example.html

您可以在此处查看行为：

Answer 1

您必须使用百分比和 dynamicResize 属性一起设置图表的大小。将高度和宽度设置为带有百分比的样式并启用 dynamicResizing。

示例：

 <google-chart #chart  
          style="border-style:solid;border-width:1px;width:90%;height:90%" 
          [title]="title"
          [type]="type"
          [data]="data"
          [columnNames]="columnNames"
          [options]="options"
          [dynamicResize]="true"              
          >

见Stackblitz

如何使 GoogleChart 在 mat-grid 中灵活？

How to make GoogleChart flexible in mat-grid?

javascript

css

google-visualization

typescript

angular