diff --git a/apps/client/src/app/components/benchmark-comparator/benchmark-comparator.component.ts b/apps/client/src/app/components/benchmark-comparator/benchmark-comparator.component.ts index aca6229fc..14bbf30dc 100644 --- a/apps/client/src/app/components/benchmark-comparator/benchmark-comparator.component.ts +++ b/apps/client/src/app/components/benchmark-comparator/benchmark-comparator.component.ts @@ -19,7 +19,8 @@ import { primaryColorRgb, secondaryColorRgb } from '@ghostfolio/common/config'; import { getBackgroundColor, getDateFormatString, - getTextColor + getTextColor, + parseDate } from '@ghostfolio/common/helper'; import { LineChartItem, @@ -56,7 +57,7 @@ export class BenchmarkComparatorComponent implements OnChanges, OnDestroy { @ViewChild('chartCanvas') chartCanvas; public benchmark: UniqueAsset; - public chart: Chart; + public chart: Chart; public isLoading = true; public constructor() { @@ -92,16 +93,13 @@ export class BenchmarkComparatorComponent implements OnChanges, OnDestroy { this.isLoading = true; const data = { - labels: this.performanceDataItems.map(({ date }) => { - return date; - }), datasets: [ { backgroundColor: `rgb(${primaryColorRgb.r}, ${primaryColorRgb.g}, ${primaryColorRgb.b})`, borderColor: `rgb(${primaryColorRgb.r}, ${primaryColorRgb.g}, ${primaryColorRgb.b})`, borderWidth: 2, - data: this.performanceDataItems.map(({ value }) => { - return value; + data: this.performanceDataItems.map(({ date, value }) => { + return { x: parseDate(date), y: value }; }), label: $localize`Portfolio` }, @@ -109,8 +107,8 @@ export class BenchmarkComparatorComponent implements OnChanges, OnDestroy { backgroundColor: `rgb(${secondaryColorRgb.r}, ${secondaryColorRgb.g}, ${secondaryColorRgb.b})`, borderColor: `rgb(${secondaryColorRgb.r}, ${secondaryColorRgb.g}, ${secondaryColorRgb.b})`, borderWidth: 2, - data: this.benchmarkDataItems.map(({ value }) => { - return value; + data: this.benchmarkDataItems.map(({ date, value }) => { + return { x: parseDate(date), y: value }; }), label: $localize`Benchmark` }