feat(charts/radial-bar): add color input for radial bar #1816

zyfra · Jul 11, 2024 · b6b65d7 · b6b65d7
1 parent 19d7853
commit b6b65d7
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 0 deletions.
diff --git a/apps/doc/src/app/charts/radial-bar/radial-bar.component.html b/apps/doc/src/app/charts/radial-bar/radial-bar.component.html
@@ -20,6 +20,7 @@
  [width]="width"
  [yField]="yField"
  [options]="options"
+ [color]="color"
  ></prizm-charts-radial-bar>
  </prizm-doc-demo>
  <prizm-doc-documentation>
@@ -90,6 +91,14 @@
  >
  Y Field Name
  </ng-template>
+ <ng-template
+ [(documentationPropertyValue)]="color"
+ documentationPropertyName="color"
+ documentationPropertyType="string"
+ documentationPropertyMode="input"
+ >
+ Color. Sets charts color. Note, for chart with seriesField use colors array.
+ </ng-template>
  </prizm-doc-documentation>
  </ng-template>
 

diff --git a/apps/doc/src/app/charts/radial-bar/radial-bar.component.ts b/apps/doc/src/app/charts/radial-bar/radial-bar.component.ts
@@ -30,6 +30,7 @@ export class RadialBarComponent {
  ];
  public xField = 'name';
  public yField = 'star';
+ color = '';
 
  public options: Partial<PrizmChartsRadialBarOptions> = {
  radius: 0.8,

diff --git a/libs/charts/base/src/lib/components/radial-bar/prizm-charts-radial-bar.component.ts b/libs/charts/base/src/lib/components/radial-bar/prizm-charts-radial-bar.component.ts
@@ -27,6 +27,14 @@ export class PrizmChartsRadialBarComponent<
  return this.origin?.options?.data;
  }
 
+ @Input()
+ public set color(value: PrizmChartsRadialBarOptions['color']) {
+ this.updateOptions({ color: value });
+ }
+ public get color(): PrizmChartsRadialBarOptions['color'] {
+ return this.options.color;
+ }
+
  @Input()
  public set label(value: PrizmChartsRadialBarOptions['label']) {
  this.updateOptions({ label: value });