typing of Color is incorrect in ColorHelper constructor

[bbarry]

Describe the bug

in version 18 the following code worked:

this.data = ['No Data'];
this.colors = new ColorHelper({ domain: ['#ccc'] }, ScaleType.Ordinal, this.data, null);

 <ngx-charts-legend
    [data]="data"
    [colors]="colors!"
...

in v19 the compiler now complains

error TS2345: Argument of type '{ domain: string[]; }' is not assignable to parameter of type 'string | Color'.
  Type '{ domain: string[]; }' is missing the following properties from type 'Color': name, selectable, group

reviewing code for ColorHelper, none of the other properties matter. It appears that there are a set of default schemes named in color-sets.ts and on those objects, the name member is also used but the other members are unused.

Perhaps a better type definition for Color would be

export interface Color {
  name?: string;
  selectable?: boolean;
  group?: ScaleType;
  domain: string[];
}

or the constructor to ColorHelper should take in a string | ColorDomain type:

export interface ColorDomain {
  domain: string[];
}

To Reproduce Steps to reproduce the behavior:

1. have working code in v18.0.1 using

    this.data = ['No Data'];
    this.colors = new ColorHelper({ domain: ['#ccc'] }, ScaleType.Ordinal, this.data, null);
   

2. update to v19.0.1

3. build

Expected behavior Build success, or at least documentation on what these additional parameters are for and why they are added.

ngx-charts version

19.0.1

[ghost]

I am also facing this issue on 19.1.0

[Shaharamir]

I'm facing the same issue too on "@swimlane/ngx-charts": "19.1.0"

[osamaalnuimi]

same here using "@swimlane/ngx-charts": "19.1.0".

[t-babin]

Seeing a similar error in 19.2.0 when trying to set a colour scheme on a chart.

[joeveiga]

@bbarry Thanks for the report! I'm not sure what those other fields in the Color interface are for (/cc @haeminn). Also if the Color interface now has a ScaleType field, then the type argument to the ColorHelper constructor might be redundant.

[trickeyone]

I'm currently using version 20.0.1 and the declaration for Color is:

export interface Color {
    name: string;
    selectable: boolean;
    group: ScaleType;
    domain: string[];
}

However, the documentation specifies that only the domain property is required. I believe the declaration should be as follows:

export interface Color {
    name?: string;
    selectable?: boolean;
    group?: ScaleType;
    domain: string[];
}

This allows passing only the required domain property instead of requiring all 4 properties to be defined.

[PGhai]

I'm currently using version 20.0.1 and the declaration for Color is:

export interface Color {
    name: string;
    selectable: boolean;
    group: ScaleType;
    domain: string[];
}

However, the documentation specifies that only the domain property is required. I believe the declaration should be as follows:

export interface Color {
    name?: string;
    selectable?: boolean;
    group?: ScaleType;
    domain: string[];
}

This allows passing only the required domain property instead of requiring all 4 properties to be defined.

This works for me!

[Ahmedsk143]

I still can't get around this bug, any help!

[osamaalnuimi]

@Ahmedsk143
check this one it's working for me

import { Color, ScaleType } from '@swimlane/ngx-charts'; colorScheme: Color = { domain: ['#99CCE5', '#FF7F7F'], group: ScaleType.Ordinal, selectable: true, name: 'Customer Usage', };

[stacklast]

@Ahmedsk143 check this one it's working for me

import { Color, ScaleType } from '@swimlane/ngx-charts'; colorScheme: Color = { domain: ['#99CCE5', '#FF7F7F'], group: ScaleType.Ordinal, selectable: true, name: 'Customer Usage', };

Great! that works for me the examples are using the old version and I was trying to figure out with the documentation that not helps.

[trickeyone]

I was able to get it to accept just the domain portion, however, I did have to disable strictTemplates in my tsconfig.json angularCompilerOptions

[koiosml]

I am getting same issue on v20.1.0

error TS2322: Type '{ domain: string[]; }' is not assignable to type 'string | Color'.
  Type '{ domain: string[]; }' is not assignable to type 'Color'.

[littlesvensson]

Same issue here if strictTemplates enabled while trying to set a custom colour scheme on a chart :((

error TS2322: Type '{ domain: string[]; }' is not assignable to type 'string | Color'. Type '{ domain: string[]; }' is not assignable to type 'Color'.

Version 20.1.0