dendi-wang/thingsboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI: Added show unicode symbols in chart value units

Browse Source
This commit is contained in:
Vladyslav_Prykhodko 2024-07-03 12:56:24 +03:00
parent 756945d252
commit 0e5f85b175
2 changed files with 11 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ui-ngx/src/app/modules/home/components/widget/lib/chart/time-series-chart-tooltip.models.ts
View File

@ -205,7 +205,7 @@ export class TimeSeriesChartTooltip {
latestData = {} as FormattedData; latestData = {} as FormattedData;
} }
const value = formatFunction(item.param.value[1], latestData, units, decimals); const value = formatFunction(item.param.value[1], latestData, units, decimals);
this.renderer.appendChild(valueElement, this.renderer.createText(value)); this.renderer.setProperty(valueElement, 'innerHTML', this.sanitizer.sanitize(SecurityContext.HTML, value));
this.renderer.setStyle(valueElement, 'flex', '1'); this.renderer.setStyle(valueElement, 'flex', '1');
this.renderer.setStyle(valueElement, 'text-align', 'end'); this.renderer.setStyle(valueElement, 'text-align', 'end');
this.renderer.setStyle(valueElement, 'font-family', this.settings.tooltipValueFont.family); this.renderer.setStyle(valueElement, 'font-family', this.settings.tooltipValueFont.family);

20
ui-ngx/src/app/modules/home/components/widget/lib/chart/time-series-chart-widget.component.html
View File

@ -74,20 +74,20 @@
<th> <th>
<ng-container *ngTemplateOutlet="legendItem; context:{legendKey: legendKey, left: true}"></ng-container> <ng-container *ngTemplateOutlet="legendItem; context:{legendKey: legendKey, left: true}"></ng-container>
</th> </th>
<td *ngIf="legendConfig.showMin === true" class="tb-time-series-chart-legend-value" [style]="legendValueStyle"> <td *ngIf="legendConfig.showMin === true" class="tb-time-series-chart-legend-value" [style]="legendValueStyle"
{{ legendData.data[legendKey.dataIndex].min }} [innerHTML]="legendData.data[legendKey.dataIndex].min | safe: 'html'">
</td> </td>
<td *ngIf="legendConfig.showMax === true" class="tb-time-series-chart-legend-value" [style]="legendValueStyle"> <td *ngIf="legendConfig.showMax === true" class="tb-time-series-chart-legend-value" [style]="legendValueStyle"
{{ legendData.data[legendKey.dataIndex].max }} [innerHTML]="legendData.data[legendKey.dataIndex].max | safe: 'html'">
</td> </td>
<td *ngIf="legendConfig.showAvg === true" class="tb-time-series-chart-legend-value" [style]="legendValueStyle"> <td *ngIf="legendConfig.showAvg === true" class="tb-time-series-chart-legend-value" [style]="legendValueStyle"
{{ legendData.data[legendKey.dataIndex].avg }} [innerHTML]="legendData.data[legendKey.dataIndex].avg | safe: 'html'">
</td> </td>
<td *ngIf="legendConfig.showTotal === true" class="tb-time-series-chart-legend-value" [style]="legendValueStyle"> <td *ngIf="legendConfig.showTotal === true" class="tb-time-series-chart-legend-value" [style]="legendValueStyle"
{{ legendData.data[legendKey.dataIndex].total }} [innerHTML]="legendData.data[legendKey.dataIndex].total | safe: 'html'">
</td> </td>
<td *ngIf="legendConfig.showLatest === true" class="tb-time-series-chart-legend-value" [style]="legendValueStyle"> <td *ngIf="legendConfig.showLatest === true" class="tb-time-series-chart-legend-value" [style]="legendValueStyle"
{{ legendData.data[legendKey.dataIndex].latest }} [innerHTML]="legendData.data[legendKey.dataIndex].latest | safe: 'html'">
</td> </td>
</tr> </tr>
</tbody> </tbody>