如何解决角垫卡不会包裹 ngx-charts 元素
我正在尝试将 ngx-charts 元素放入 Angular 中的 mat-cards 中。
但是 <mat-card>
不会封装图形。我发现了完全相同的问题 here,但该解决方案似乎对我不起作用。
我的 html 看起来像这样:
<mat-card>
<mat-card-header>
<mat-card-title>Starting fifteen</mat-card-title>
</mat-card-header>
<ngx-charts-pie-chart
[results]="starting"
[legend]="false"
[doughnut]="true"
[view]="[100,100]"
[labels]="false" >
</ngx-charts-pie-chart>
</mat-card>
解决方案建议将 <ngx-charts-pie-chart>
包装在 <div class="spectre-pie-chart">
中并对其应用以下样式:
:host {
height: 100%;
width: 100%;
}
.spectre-pie-chart {
height: 100%;
width: 100%;
float: right;
}
我想我可能将 sccs
应用于错误的元素。解决方案对于如何应用它并不过分特别。有人能帮我把卡片完全包裹在图形上吗?
解决方法
<div class="chart-container">
<div class="spectre-pie-chart">
<ngx-charts-pie-chart
[results]="starting"
[legend]="false"
[doughnut]="true"
[view]="[100,100]"
[labels]="false" >
</ngx-charts-pie-chart>
</div>
</div>
您应该将图表添加到父容器中,它应该可以解决您的问题
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。