Browse Source

Task/refactor rounding logic in treemap chart component (#7200)

* Refactor rounding logic

* Update changelog
pull/7199/head^2
Thomas Kaul 2 weeks ago
committed by GitHub
parent
commit
ca6716e7ba
No known key found for this signature in database GPG Key ID: B5690EEEBB952194
  1. 1
      CHANGELOG.md
  2. 25
      libs/ui/src/lib/treemap-chart/treemap-chart.component.ts

1
CHANGELOG.md

@ -9,6 +9,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
### Changed ### Changed
- Refactored the rounding logic in the treemap chart component
- Restricted the modification of activity tags in the impersonation mode - Restricted the modification of activity tags in the impersonation mode
- Hardened the endpoint of the public access for portfolio sharing by restricting it to public accesses - Hardened the endpoint of the public access for portfolio sharing by restricting it to public accesses
- Improved the parsing of integer query parameters (`skip` and `take`) in the `GET api/v1/admin/user` endpoint - Improved the parsing of integer query parameters (`skip` and `take`) in the `GET api/v1/admin/user` endpoint

25
libs/ui/src/lib/treemap-chart/treemap-chart.component.ts

@ -30,7 +30,7 @@ import { Chart, Tooltip } from 'chart.js';
import { TreemapController, TreemapElement } from 'chartjs-chart-treemap'; import { TreemapController, TreemapElement } from 'chartjs-chart-treemap';
import { isUUID } from 'class-validator'; import { isUUID } from 'class-validator';
import { differenceInDays, max } from 'date-fns'; import { differenceInDays, max } from 'date-fns';
import { orderBy } from 'lodash'; import { orderBy, round } from 'lodash';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader'; import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
import OpenColor from 'open-color'; import OpenColor from 'open-color';
@ -221,9 +221,10 @@ export class GfTreemapChartComponent
) )
}).toNumber(); }).toNumber();
// Round to 2 decimal places annualizedNetPerformancePercent = round(
annualizedNetPerformancePercent = annualizedNetPerformancePercent,
Math.round(annualizedNetPerformancePercent * 100) / 100; 2
);
const { backgroundColor } = this.getColor({ const { backgroundColor } = this.getColor({
annualizedNetPerformancePercent, annualizedNetPerformancePercent,
@ -252,9 +253,10 @@ export class GfTreemapChartComponent
) )
}).toNumber(); }).toNumber();
// Round to 2 decimal places annualizedNetPerformancePercent = round(
annualizedNetPerformancePercent = annualizedNetPerformancePercent,
Math.round(annualizedNetPerformancePercent * 100) / 100; 2
);
const { fontColor } = this.getColor({ const { fontColor } = this.getColor({
annualizedNetPerformancePercent, annualizedNetPerformancePercent,
@ -267,11 +269,10 @@ export class GfTreemapChartComponent
display: true, display: true,
font: [{ size: 16 }, { lineHeight: 1.5, size: 14 }], font: [{ size: 16 }, { lineHeight: 1.5, size: 14 }],
formatter: ({ raw }: GfTreemapScriptableContext) => { formatter: ({ raw }: GfTreemapScriptableContext) => {
// Round to 4 decimal places let netPerformancePercentWithCurrencyEffect = round(
let netPerformancePercentWithCurrencyEffect = raw._data.netPerformancePercentWithCurrencyEffect,
Math.round( 4
raw._data.netPerformancePercentWithCurrencyEffect * 10000 );
) / 10000;
if (Math.abs(netPerformancePercentWithCurrencyEffect) === 0) { if (Math.abs(netPerformancePercentWithCurrencyEffect) === 0) {
netPerformancePercentWithCurrencyEffect = Math.abs( netPerformancePercentWithCurrencyEffect = Math.abs(

Loading…
Cancel
Save