Browse Source

value formatter option

merge-requests/1/merge
rozetko 4 years ago
parent
commit
8380736bd6
  1. 1
      dist/index.d.ts
  2. 2
      dist/index.js
  3. 6
      dist/types.d.ts
  4. 18
      src/index.ts
  5. 6
      src/types.ts

1
dist/index.d.ts vendored

@ -25,7 +25,6 @@ export declare class ChartwerkGaugePod extends ChartwerkPod<GaugeTimeSerie, Gaug
rescaleArcRadius(radius: number): number; rescaleArcRadius(radius: number): number;
rescaleValueFont(fontsize: number): number; rescaleValueFont(fontsize: number): number;
private get _scaleFactor(); private get _scaleFactor();
private get _valueTextDecimals();
private get aggregatedValue(); private get aggregatedValue();
private get _maxValue(); private get _maxValue();
onMouseOver(): void; onMouseOver(): void;

2
dist/index.js vendored

File diff suppressed because one or more lines are too long

6
dist/types.d.ts vendored

@ -9,9 +9,7 @@ export declare type Stop = {
color: string; color: string;
value: number | null; value: number | null;
}; };
export declare type ValueTextFormat = { export declare type ValueFormatter = (value: number) => string;
decimals: number;
};
export declare type GaugeTimeSerie = TimeSerie; export declare type GaugeTimeSerie = TimeSerie;
export declare type GaugeOptionsParams = { export declare type GaugeOptionsParams = {
innerRadius: number; innerRadius: number;
@ -23,6 +21,6 @@ export declare type GaugeOptionsParams = {
}[]; }[];
defaultColor: string; defaultColor: string;
stat: Stat; stat: Stat;
valueTextFormat: ValueTextFormat; valueFormatter: ValueFormatter;
}; };
export declare type GaugeOptions = Options & Partial<GaugeOptionsParams>; export declare type GaugeOptions = Options & Partial<GaugeOptionsParams>;

18
src/index.ts

@ -45,9 +45,7 @@ const DEFAULT_GAUGE_OPTIONS: GaugeOptions = {
stat: Stat.CURRENT, stat: Stat.CURRENT,
innerRadius: DEFAULT_INNER_RADIUS, innerRadius: DEFAULT_INNER_RADIUS,
outerRadius: DEFAULT_OUTER_RADIUS, outerRadius: DEFAULT_OUTER_RADIUS,
valueTextFormat: { valueFormatter: val => val.toString()
decimals: DEFAULT_VALUE_TEXT_Decimals
}
}; };
export class ChartwerkGaugePod extends ChartwerkPod<GaugeTimeSerie, GaugeOptions> { export class ChartwerkGaugePod extends ChartwerkPod<GaugeTimeSerie, GaugeOptions> {
@ -198,8 +196,11 @@ export class ChartwerkGaugePod extends ChartwerkPod<GaugeTimeSerie, GaugeOptions
} }
private get _valueText(): string { private get _valueText(): string {
const decimalsCount = this._valueTextDecimals; if(this.options.valueFormatter) {
return this.aggregatedValue.toFixed(decimalsCount); console.log('valueFormatter function is not specified, rendering raw value');
return this.aggregatedValue.toString();
}
return this.options.valueFormatter(this.aggregatedValue);
} }
private get _valueTextFontSize(): number { private get _valueTextFontSize(): number {
@ -246,13 +247,6 @@ export class ChartwerkGaugePod extends ChartwerkPod<GaugeTimeSerie, GaugeOptions
return scale; return scale;
} }
private get _valueTextDecimals(): number {
if(this.options.valueTextFormat === undefined) {
throw new Error(`Options has no valueTextFormat`);
}
return this.options.valueTextFormat.decimals;
}
private get aggregatedValue(): number { private get aggregatedValue(): number {
switch(this._stat) { switch(this._stat) {
case Stat.CURRENT: case Stat.CURRENT:

6
src/types.ts

@ -12,9 +12,7 @@ export type Stop = {
value: number | null value: number | null
}; };
export type ValueTextFormat = { export type ValueFormatter = (value: number) => string;
decimals: number
};
export type GaugeTimeSerie = TimeSerie; export type GaugeTimeSerie = TimeSerie;
@ -26,6 +24,6 @@ export type GaugeOptionsParams = {
stops: { color: string , value: number }[]; stops: { color: string , value: number }[];
defaultColor: string; defaultColor: string;
stat: Stat; stat: Stat;
valueTextFormat: ValueTextFormat; valueFormatter: ValueFormatter;
} }
export type GaugeOptions = Options & Partial<GaugeOptionsParams>; export type GaugeOptions = Options & Partial<GaugeOptionsParams>;

Loading…
Cancel
Save