как отключить вертикальную полосу прокрутки в угловых диаграммах

#css #angular #sass #chart.js #scrollbar

Вопрос:

у меня есть угловой компонент в виде: введите описание изображения здесь

я хочу отключить вертикальную горизонтальную полосу, чтобы диаграмма вписывалась в компонент. я пытался использовать класс css в качестве:

 .scroll-disable {overflow-y: hidden !important;}
 

и используйте этот класс в моем div как:

 <div class="scroll-disable">
<mat-dialog-action class="close-button">
    <button mat-icon-button (click)="onNoClick()"  [mat-dialog-close]="true">
        <mat-icon class="close-icon" color="warn">X</mat-icon>
    </button>
</mat-dialog-action>

<div class="chartWrapper">

    <div class="chartAreaWrapper">
        <canvas id="myChart" #mychart></canvas>
    </div>
    <canvas id="chartAxis" height="0" width="0"></canvas>
    
</div>
 

это не работает, и вертикальная полоса по-прежнему отображается, как на картинке выше, не могли бы вы, пожалуйста, помочь мне в этом, заранее спасибо.