Angular 根据角度调整SVG的大小

我正在使用AngularJS（不是AngularJS），我正在尝试在我的项目中插入一个圆图

HTML代码是：

<svg viewbox="0 0 36 36" class="circular-chart">
  <path class="circle"
    stroke-dasharray="60, 100"
    d="M18 2.0845
      a 15.9155 15.9155 0 0 1 0 31.831
      a 15.9155 15.9155 0 0 1 0 -31.831"
  />
  </svg>

如果您尝试在HTML页面中查看此图，则不会有任何问题。您可以根据需要调整大小。但是如果你尝试在你的角度投影图中插入这段代码，显示的非常小，我无法调整它的大小

我什么都试过了！我对CSS做了各种各样的更改，什么都没有。我不知道如何调整它的大小…：（

只要改变你的课堂 例如： CSS

。圆形图表{
显示：块；
-webkit转换：规模（3）；
变换：尺度（3）；
}

如何调整大小？如果我在html和css文件中编写此代码，只需更改“圆形图表”的“最大高度”类并调整其大小。但如果我在Angular项目中更改此属性，则不会发生任何事情…请找到一种方法，在您的问题中包含a。正如您所承认的，您在此处发布的内容是有效的。因此，它无助于解决您的问题。因此，它一定与您在Angular项目中使用它的方式有关。我们需要在行动中看到此问题为了帮助你，你只需要创建一个角度项目（不是AngularJS项目）并将此代码插入到角度组件中，以查看您无法调整图形的大小。是的，在index.html中，它工作得非常好，但如果您尝试在角度组件中运行它，则无法调整其大小，并且它显示的值非常小。欢迎使用此选项！请编辑您的问题并添加更多解决方案的解释，同时将其与问题联系起来。例如：更多指导：

.circular-chart {
  display: block;
  margin: 10px auto;
  max-width: 80%;
  max-height: 250px;
}

.circle {
  stroke: #4CC790;
  fill: none;
  stroke-width: 2.8pt;
  stroke-linecap: round;
  animation: progress 1s ease-out forwards;
}

@keyframes progress {
  0% {
    stroke-dasharray: 0, 100;
  }
}