Skip to content

Commit

Permalink
docs(echarts): adapt theme logic in examples
Browse files Browse the repository at this point in the history
  • Loading branch information
jul-lam committed Dec 19, 2024
1 parent ac16bc8 commit 6d47f23
Show file tree
Hide file tree
Showing 60 changed files with 233 additions and 377 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
*/

import { Component, OnInit } from '@angular/core';
import { convertThemeName, registerTheme } from '@siemens/ix-echarts';
import { registerTheme } from '@siemens/ix-echarts';
import { themeSwitcher } from '@siemens/ix';
import * as echarts from 'echarts/core';
import { BarSeriesOption, EChartsOption } from 'echarts';
Expand All @@ -19,7 +19,7 @@ import { BarSeriesOption, EChartsOption } from 'echarts';
styleUrls: ['./echarts-bar-horizontal-stacked.css'],
})
export default class EchartsBarHorizontalStacked implements OnInit {
theme = convertThemeName(themeSwitcher.getCurrentTheme());
theme = themeSwitcher.getCurrentTheme();

data = {
years: ['2023', '2022', '2021', '2020', '2019'],
Expand Down Expand Up @@ -66,7 +66,7 @@ export default class EchartsBarHorizontalStacked implements OnInit {
registerTheme(echarts);

themeSwitcher.themeChanged.on((theme: string) => {
this.theme = convertThemeName(theme);
this.theme = theme;
});
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -8,20 +8,27 @@
*/

import { Component, OnInit } from '@angular/core';
import { convertThemeName, registerTheme } from '@siemens/ix-echarts';
import { registerTheme } from '@siemens/ix-echarts';
import { themeSwitcher } from '@siemens/ix';
import * as echarts from 'echarts/core';
import { EChartsOption } from 'echarts';

@Component({
selector: 'app-example',
templateUrl: './echarts-bar-simple.html',
styleUrls: ["./echarts-bar-simple.css"],
styleUrls: ['./echarts-bar-simple.css'],
})
export default class EchartsBarSimple implements OnInit {
theme = convertThemeName(themeSwitcher.getCurrentTheme());
theme = themeSwitcher.getCurrentTheme();
data = {
products: ['Product A', 'Product B', 'Product C', 'Product D', 'Product E', 'Product F'],
products: [
'Product A',
'Product B',
'Product C',
'Product D',
'Product E',
'Product F',
],
sales: [10.3, 9.2, 7.3, 6.4, 6.2, 4.4],
};

Expand Down Expand Up @@ -50,7 +57,7 @@ export default class EchartsBarSimple implements OnInit {
registerTheme(echarts);

themeSwitcher.themeChanged.on((theme: string) => {
this.theme = convertThemeName(theme);
this.theme = theme;
});
}
}
12 changes: 4 additions & 8 deletions packages/angular-test-app/src/preview-examples/echarts-circle.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,22 +8,18 @@
*/

import { Component, OnInit } from '@angular/core';
import {
convertThemeName,
getComputedCSSProperty,
registerTheme,
} from '@siemens/ix-echarts';
import { getComputedCSSProperty, registerTheme } from '@siemens/ix-echarts';
import { themeSwitcher } from '@siemens/ix';
import * as echarts from 'echarts/core';
import { EChartsOption } from 'echarts';

@Component({
selector: 'app-example',
templateUrl: './echarts-circle.html',
styleUrls: ["./echarts-circle.css"],
styleUrls: ['./echarts-circle.css'],
})
export default class EchartsCircle implements OnInit {
theme = convertThemeName(themeSwitcher.getCurrentTheme());
theme = themeSwitcher.getCurrentTheme();

data = [
{ value: 72.17, name: 'Windows' },
Expand Down Expand Up @@ -70,7 +66,7 @@ export default class EchartsCircle implements OnInit {
registerTheme(echarts);

themeSwitcher.themeChanged.on((theme: string) => {
this.theme = convertThemeName(theme);
this.theme = theme;
});
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
*/

import { Component, OnInit } from '@angular/core';
import { convertThemeName, registerTheme } from '@siemens/ix-echarts';
import { registerTheme } from '@siemens/ix-echarts';
import { themeSwitcher } from '@siemens/ix';
import * as echarts from 'echarts/core';
import { EChartsOption } from 'echarts';
Expand All @@ -19,7 +19,7 @@ import { EChartsOption } from 'echarts';
styleUrls: ['./echarts-empty-state.css'],
})
export default class EchartsLineSimple implements OnInit {
theme = convertThemeName(themeSwitcher.getCurrentTheme());
theme = themeSwitcher.getCurrentTheme();
data = {
weekdays: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
value: [],
Expand All @@ -45,7 +45,7 @@ export default class EchartsLineSimple implements OnInit {
registerTheme(echarts);

themeSwitcher.themeChanged.on((theme: string) => {
this.theme = convertThemeName(theme);
this.theme = theme;
});
}
}
12 changes: 4 additions & 8 deletions packages/angular-test-app/src/preview-examples/echarts-gauge.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,22 +8,18 @@
*/

import { Component, OnInit } from '@angular/core';
import {
convertThemeName,
getComputedCSSProperty,
registerTheme,
} from '@siemens/ix-echarts';
import { getComputedCSSProperty, registerTheme } from '@siemens/ix-echarts';
import { themeSwitcher } from '@siemens/ix';
import * as echarts from 'echarts/core';
import { EChartsOption } from 'echarts';

@Component({
selector: 'app-example',
templateUrl: './echarts-gauge.html',
styleUrls: ["./echarts-gauge.css"],
styleUrls: ['./echarts-gauge.css'],
})
export default class EchartsGauge implements OnInit {
theme = convertThemeName(themeSwitcher.getCurrentTheme());
theme = themeSwitcher.getCurrentTheme();

value = 45.3;

Expand Down Expand Up @@ -132,7 +128,7 @@ export default class EchartsGauge implements OnInit {
registerTheme(echarts);

themeSwitcher.themeChanged.on((theme: string) => {
this.theme = convertThemeName(theme);
this.theme = theme;
});
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -8,22 +8,18 @@
*/

import { Component, OnInit } from '@angular/core';
import {
convertThemeName,
registerTheme,
getComputedCSSProperty,
} from '@siemens/ix-echarts';
import { registerTheme, getComputedCSSProperty } from '@siemens/ix-echarts';
import { themeSwitcher } from '@siemens/ix';
import * as echarts from 'echarts/core';
import { EChartsOption } from 'echarts';

@Component({
selector: 'app-example',
templateUrl: './echarts-line-advanced.html',
styleUrls: ["./echarts-line-advanced.css"],
styleUrls: ['./echarts-line-advanced.css'],
})
export default class EchartsLineAdvanced implements OnInit {
theme = convertThemeName(themeSwitcher.getCurrentTheme());
theme = themeSwitcher.getCurrentTheme();

dates = Array.from({ length: 2025 - 2013 }, (_, i) => (2013 + i).toString());

Expand Down Expand Up @@ -76,7 +72,7 @@ export default class EchartsLineAdvanced implements OnInit {
registerTheme(echarts);

themeSwitcher.themeChanged.on((theme: string) => {
this.theme = convertThemeName(theme);
this.theme = theme;
});
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -8,11 +8,7 @@
*/

import { Component, OnInit } from '@angular/core';
import {
convertThemeName,
getComputedCSSProperty,
registerTheme,
} from '@siemens/ix-echarts';
import { getComputedCSSProperty, registerTheme } from '@siemens/ix-echarts';
import { themeSwitcher } from '@siemens/ix';
import * as echarts from 'echarts/core';
import { EChartsOption, SeriesOption } from 'echarts';
Expand All @@ -21,10 +17,10 @@ import { YAXisOption } from 'echarts/types/dist/shared';
@Component({
selector: 'app-example',
templateUrl: './echarts-line-multiple-y-axis.html',
styleUrls: ["./echarts-line-multiple-y-axis.css"],
styleUrls: ['./echarts-line-multiple-y-axis.css'],
})
export default class EchartsLineMultipleYAxis implements OnInit {
theme = convertThemeName(themeSwitcher.getCurrentTheme());
theme = themeSwitcher.getCurrentTheme();

dates = Array.from({ length: 2025 - 2013 }, (_, i) => (2013 + i).toString());

Expand Down Expand Up @@ -169,7 +165,7 @@ export default class EchartsLineMultipleYAxis implements OnInit {
registerTheme(echarts);

themeSwitcher.themeChanged.on((theme: string) => {
this.theme = convertThemeName(theme);
this.theme = theme;
});
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -8,18 +8,18 @@
*/

import { Component, OnInit } from '@angular/core';
import { convertThemeName, registerTheme } from '@siemens/ix-echarts';
import { registerTheme } from '@siemens/ix-echarts';
import { themeSwitcher } from '@siemens/ix';
import * as echarts from 'echarts/core';
import { EChartsOption } from 'echarts';

@Component({
selector: 'app-example',
templateUrl: './echarts-line-simple.html',
styleUrls: ["./echarts-line-simple.css"],
styleUrls: ['./echarts-line-simple.css'],
})
export default class EchartsLineSimple implements OnInit {
theme = convertThemeName(themeSwitcher.getCurrentTheme());
theme = themeSwitcher.getCurrentTheme();

data = {
weekdays: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
Expand Down Expand Up @@ -48,7 +48,7 @@ export default class EchartsLineSimple implements OnInit {
registerTheme(echarts);

themeSwitcher.themeChanged.on((theme: string) => {
this.theme = convertThemeName(theme);
this.theme = theme;
});
}
}
8 changes: 4 additions & 4 deletions packages/angular-test-app/src/preview-examples/echarts-pie.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,18 +8,18 @@
*/

import { Component, OnInit } from '@angular/core';
import {convertThemeName, getComputedCSSProperty, registerTheme} from '@siemens/ix-echarts';
import { getComputedCSSProperty, registerTheme } from '@siemens/ix-echarts';
import { themeSwitcher } from '@siemens/ix';
import * as echarts from 'echarts/core';
import { EChartsOption } from 'echarts';

@Component({
selector: 'app-example',
templateUrl: './echarts-pie.html',
styleUrls: ["./echarts-pie.css"],
styleUrls: ['./echarts-pie.css'],
})
export default class EchartsPie implements OnInit {
theme = convertThemeName(themeSwitcher.getCurrentTheme());
theme = themeSwitcher.getCurrentTheme();

data = [
{ value: 29.4, name: 'China' },
Expand Down Expand Up @@ -65,7 +65,7 @@ export default class EchartsPie implements OnInit {
registerTheme(echarts);

themeSwitcher.themeChanged.on((theme: string) => {
this.theme = convertThemeName(theme);
this.theme = theme;
});
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -8,22 +8,18 @@
*/

import { Component, OnInit } from '@angular/core';
import {
convertThemeName,
getComputedCSSProperty,
registerTheme,
} from '@siemens/ix-echarts';
import { getComputedCSSProperty, registerTheme } from '@siemens/ix-echarts';
import { themeSwitcher } from '@siemens/ix';
import * as echarts from 'echarts/core';
import { EChartsOption } from 'echarts';

@Component({
selector: 'app-example',
templateUrl: './echarts-progress-arc.html',
styleUrls: ["./echarts-progress-arc.css"],
styleUrls: ['./echarts-progress-arc.css'],
})
export default class EchartsProgressArc implements OnInit {
theme = convertThemeName(themeSwitcher.getCurrentTheme());
theme = themeSwitcher.getCurrentTheme();

value = 60;

Expand All @@ -36,9 +32,7 @@ export default class EchartsProgressArc implements OnInit {
show: true,
lineStyle: {
width: 15,
color: [
[1, getComputedCSSProperty('color-neutral-40')],
],
color: [[1, getComputedCSSProperty('color-neutral-40')]],
},
},
axisTick: {
Expand Down Expand Up @@ -91,7 +85,7 @@ export default class EchartsProgressArc implements OnInit {
registerTheme(echarts);

themeSwitcher.themeChanged.on((theme: string) => {
this.theme = convertThemeName(theme);
this.theme = theme;
});
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -8,22 +8,18 @@
*/

import { Component, OnInit } from '@angular/core';
import {
convertThemeName,
getComputedCSSProperty,
registerTheme,
} from '@siemens/ix-echarts';
import { getComputedCSSProperty, registerTheme } from '@siemens/ix-echarts';
import { themeSwitcher } from '@siemens/ix';
import * as echarts from 'echarts/core';
import { EChartsOption } from 'echarts';

@Component({
selector: 'app-example',
templateUrl: './echarts-progress-circle.html',
styleUrls: ["./echarts-progress-circle.css"],
styleUrls: ['./echarts-progress-circle.css'],
})
export default class EchartsProgressCircle implements OnInit {
theme = convertThemeName(themeSwitcher.getCurrentTheme());
theme = themeSwitcher.getCurrentTheme();

value = 60;

Expand All @@ -36,9 +32,7 @@ export default class EchartsProgressCircle implements OnInit {
show: true,
lineStyle: {
width: 15,
color: [
[1, getComputedCSSProperty('color-neutral-40')],
],
color: [[1, getComputedCSSProperty('color-neutral-40')]],
},
},
axisTick: {
Expand Down Expand Up @@ -99,7 +93,7 @@ export default class EchartsProgressCircle implements OnInit {
registerTheme(echarts);

themeSwitcher.themeChanged.on((theme: string) => {
this.theme = convertThemeName(theme);
this.theme = theme;
});
}
}
Loading

0 comments on commit 6d47f23

Please sign in to comment.