search

NG-ZORRO / ng-zorro-antd

Angular UI Component Library based on Ant Design
https://ng.ant.design
MIT License
8.87k stars 3.94k forks source link

nzGapDegree is inaccurate when using progress bar type 'dashboard' #7401

Open hyh014 opened 2 years ago

hyh014 commented 2 years ago

Reproduction link

https://stackblitz.com/edit/ng-zorro-antd-ivy-ymk92e?file=src/app/app.component.ts

Steps to reproduce

Case 1

  1. Create a nz-progress component that is nzType="dashboard"
  2. Change nzGapDegree to 180

Case 2

  1. Create a nz-progress component that is nzType="dashboard"
  2. Change nzGapDegree to a number higher than 295 but less than 360

What is expected?

Case 1

It should create progress bar of a semi-circle with a gap of 180 degree

Case 2

It should create a progress bar with the degree that was given

What is actually happening?

Case 1

Currently, it is not exactly a semi-circle with 180 degree, it's smaller than that

Case 2

It will create a full circle instead of a dashboard bar with the appropriate degree

Environment Info
ng-zorro-antd 13.2.1
Browser Chrome

I changed the version to 13.2.1 but it seems to be happening to the previous versions as well

wzhudev commented 2 years ago

Ref https://github.com/ant-design/ant-design/issues/35352