@nova-ui/dashboards
Version:
Nova Dashboards is a framework designed to provide feature developers with a common solution for presenting data coming from various sources within a single view, as well as a set of predefined widget visualizations that are 100% configuration-driven and
180 lines • 8.19 kB
JavaScript
"use strict";
// © 2022 SolarWinds Worldwide, LLC. All rights reserved.
//
// Permission is hereby granted, free of charge, to any person obtaining a copy
// of this software and associated documentation files (the "Software"), to
// deal in the Software without restriction, including without limitation the
// rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
// sell copies of the Software, and to permit persons to whom the Software is
// furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
// all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
// THE SOFTWARE.
Object.defineProperty(exports, "__esModule", { value: true });
exports.TimeseriesChartComponent = void 0;
const tslib_1 = require("tslib");
const core_1 = require("@angular/core");
const rxjs_1 = require("rxjs");
const operators_1 = require("rxjs/operators");
const bits_1 = require("@nova-ui/bits");
const types_1 = require("../../../services/types");
const types_2 = require("../../../types");
const timeseries_helpers_1 = require("../timeseries-helpers");
const timeseries_scales_service_1 = require("../timeseries-scales.service");
const types_3 = require("../types");
let TimeseriesChartComponent = class TimeseriesChartComponent {
get seriesInteractive() {
return (this.configuration?.interaction === "series" ||
this.dataSource?.features?.getFeatureConfig(types_2.WellKnownDataSourceFeatures.Interactivity)?.enabled ||
false);
}
constructor(eventBus, timeseriesScalesService, dataSource) {
this.eventBus = eventBus;
this.timeseriesScalesService = timeseriesScalesService;
this.dataSource = dataSource;
this.widgetData = {};
this.configuration = {};
this.scales = {};
this.destroy$ = new rxjs_1.Subject();
this.buildChart$ = new rxjs_1.Subject();
this.resetChart = false;
this.chartBuilt = false;
this.buildChart$.pipe((0, operators_1.takeUntil)(this.destroy$)).subscribe(() => {
this.chartBuilt = true;
});
}
ngOnInit() {
// save original data
if (this.configuration.preset === types_3.TimeseriesChartPreset.Line &&
this.widgetData &&
this.widgetData.series) {
this.widgetData.series.forEach((serie) => (serie.rawData = serie.data));
}
}
ngOnChanges(changes) {
let shouldUpdateChart = false;
let shouldRebuildChart = false;
if (changes.configuration) {
const configurationCurrent = changes.configuration.currentValue;
const configurationPrevious = changes.configuration.previousValue;
if (configurationCurrent?.preset !== configurationPrevious?.preset) {
shouldRebuildChart = true;
}
if (configurationCurrent?.scales !== configurationPrevious?.scales) {
const scaleKeys = Object.keys(configurationCurrent?.scales);
for (const scaleKey of scaleKeys) {
const scaleConfigCurrent = configurationCurrent?.scales?.[scaleKey];
const scaleConfigPrevious = configurationPrevious?.scales?.[scaleKey];
if (!scaleConfigCurrent) {
continue;
}
if (scaleConfigCurrent?.type !==
scaleConfigPrevious?.type ||
scaleConfigCurrent?.properties?.axisUnits !==
scaleConfigPrevious?.properties?.axisUnits) {
this.scales[scaleKey] =
this.timeseriesScalesService.getScale(scaleConfigCurrent, configurationCurrent.units, this.configuration);
shouldUpdateChart = true;
}
else if (scaleConfigCurrent?.properties !==
scaleConfigPrevious?.properties) {
this.timeseriesScalesService.updateConfiguration(this.scales[scaleKey], scaleConfigCurrent, this.configuration);
shouldUpdateChart = true;
}
}
}
}
if (shouldRebuildChart || !this.chartBuilt) {
this.buildChart();
}
if (changes.widgetData && !changes.widgetData.isFirstChange()) {
if (this.widgetData?.series?.length === 0) {
this.resetChart = true;
}
if (this.widgetData && this.widgetData.series) {
if (this.resetChart && this.widgetData?.series?.length > 0) {
this.resetChart = false;
this.buildChart();
}
this.applyPreviousTransformer(changes.widgetData.previousValue);
shouldUpdateChart = true;
}
}
if (shouldUpdateChart) {
this.updateChartData();
}
}
ngOnDestroy() {
this.destroy$.next();
this.destroy$.complete();
this.buildChart$.complete();
}
applyPreviousTransformer(previousData) {
// save original data and transform it
this.widgetData.series.forEach((serie) => {
serie.rawData = serie.data;
serie.transformer = previousData?.series.find((prevSerie) => prevSerie.id === serie.id)?.transformer;
this.transformSeriesData(serie);
});
}
transformSeriesData(serie) {
if (serie.transformer && serie.rawData && serie.rawData.length > 0) {
try {
const hasPercentile = serie.metricUnits === "percent";
serie.data = serie.transformer(serie.rawData, hasPercentile);
this.updateYAxisDomain();
}
catch (e) {
serie.transformer = undefined;
serie.data = serie.rawData;
console.error(e.message);
}
}
}
updateYAxisDomain() {
const scaleKeys = ["y", "yRight"];
for (const scaleKey of scaleKeys) {
const scaleConfig = this.configuration.scales?.[scaleKey];
if (scaleConfig?.properties) {
scaleConfig.properties.domain = {
...(0, timeseries_helpers_1.metricsSeriesMeasurementsMinMax)(this.widgetData.series, scaleConfig?.properties?.axisUnits),
};
this.timeseriesScalesService.updateConfiguration(this.scales[scaleKey], scaleConfig, this.configuration);
}
}
}
removeMetric(metricId) {
this.eventBus.next(types_1.CHART_METRIC_REMOVE, {
payload: {
metricId: metricId,
groupUniqueId: this.configuration.groupUniqueId,
},
});
}
};
exports.TimeseriesChartComponent = TimeseriesChartComponent;
tslib_1.__decorate([
(0, core_1.Input)(),
tslib_1.__metadata("design:type", Object)
], TimeseriesChartComponent.prototype, "widgetData", void 0);
tslib_1.__decorate([
(0, core_1.Input)(),
tslib_1.__metadata("design:type", Object)
], TimeseriesChartComponent.prototype, "configuration", void 0);
exports.TimeseriesChartComponent = TimeseriesChartComponent = tslib_1.__decorate([
(0, core_1.Directive)()
// eslint-disable-next-line @angular-eslint/directive-class-suffix
,
tslib_1.__param(0, (0, core_1.Inject)(types_2.PIZZAGNA_EVENT_BUS)),
tslib_1.__metadata("design:paramtypes", [bits_1.EventBus,
timeseries_scales_service_1.TimeseriesScalesService, Object])
], TimeseriesChartComponent);
//# sourceMappingURL=timeseries-chart.component.js.map