diff --git a/projects/observability/src/pages/explorer/explorer-dashboard-builder.test.ts b/projects/observability/src/pages/explorer/explorer-dashboard-builder.test.ts
index 6d21fc713..0af467ad6 100644
--- a/projects/observability/src/pages/explorer/explorer-dashboard-builder.test.ts
+++ b/projects/observability/src/pages/explorer/explorer-dashboard-builder.test.ts
@@ -3,7 +3,7 @@ import { Dashboard } from '@hypertrace/hyperdash';
import { recordObservable, runFakeRxjs } from '@hypertrace/test-utils';
import { MockService } from 'ng-mocks';
import { EMPTY, of } from 'rxjs';
-import { CartesianSeriesVisualizationType } from '../../shared/components/cartesian/chart';
+import { CartesianSeriesVisualizationType, ScaleType } from '../../shared/components/cartesian/chart';
import { ExploreVisualizationRequest } from '../../shared/components/explore-query-editor/explore-visualization-builder';
import { LegendPosition } from '../../shared/components/legend/legend.component';
import { ExplorerVisualizationCartesianDataSourceModel } from '../../shared/dashboard/data/graphql/explorer-visualization/explorer-visualization-cartesian-data-source.model';
@@ -45,6 +45,11 @@ describe('Explorer dashboard builder', () => {
'selection-handler': {
type: 'cartesian-explorer-selection-handler',
'show-context-menu': false
+ },
+ 'x-axis': {
+ type: 'cartesian-axis',
+ 'scale-type': ScaleType.Band,
+ 'show-tick-labels': false
}
},
onReady: expect.any(Function)
diff --git a/projects/observability/src/pages/explorer/explorer-dashboard-builder.ts b/projects/observability/src/pages/explorer/explorer-dashboard-builder.ts
index aea7d175a..b6ef693e7 100644
--- a/projects/observability/src/pages/explorer/explorer-dashboard-builder.ts
+++ b/projects/observability/src/pages/explorer/explorer-dashboard-builder.ts
@@ -71,14 +71,7 @@ export class ExplorerDashboardBuilder {
type: 'cartesian-explorer-selection-handler',
'show-context-menu': false
},
- ...(!isEmpty(request.groupBy) && isEmpty(request.interval)
- ? {
- 'x-axis': {
- type: 'cartesian-axis',
- 'scale-type': ScaleType.Band
- }
- }
- : {})
+ ...this.buildXAxis(request)
},
onReady: dashboard => {
dashboard.createAndSetRootDataFromModelClass(ExplorerVisualizationCartesianDataSourceModel);
@@ -168,6 +161,29 @@ export class ExplorerDashboardBuilder {
};
}
+ private buildXAxis(request: ExploreVisualizationRequest): object {
+ if (isEmpty(request.interval)) {
+ if (isEmpty(request.groupBy)) {
+ return {
+ 'x-axis': {
+ type: 'cartesian-axis',
+ 'scale-type': ScaleType.Band,
+ 'show-tick-labels': false
+ }
+ };
+ } else {
+ return {
+ 'x-axis': {
+ type: 'cartesian-axis',
+ 'scale-type': ScaleType.Band
+ }
+ };
+ }
+ }
+
+ return {};
+ }
+
private getRendererForType(type: AttributeMetadataType): string {
switch (type) {
case AttributeMetadataType.Long:
diff --git a/projects/observability/src/shared/components/explore-query-editor/explore-query-editor.component.ts b/projects/observability/src/shared/components/explore-query-editor/explore-query-editor.component.ts
index 8d518d08e..f4148a3c4 100644
--- a/projects/observability/src/shared/components/explore-query-editor/explore-query-editor.component.ts
+++ b/projects/observability/src/shared/components/explore-query-editor/explore-query-editor.component.ts
@@ -58,7 +58,7 @@ import {
this.buildGroupedTimeseriesData(spec, groupByExpressions, result)).flat();
}
- return [];
+ return aggregatableSpecs.map(spec => this.buildMetricAggregationSeriesData(spec, result));
}
private buildSeries(request: ExploreRequestState, result: SeriesData, color: string): Observable {
@@ -174,6 +174,15 @@ export abstract class ExploreCartesianDataSourceModel extends GraphQlDataSourceM
};
}
+ public buildMetricAggregationSeriesData(spec: AggregatableSpec, result: ExploreResult): SeriesData {
+ const metricAggregationData = result.getMetricAggregationSeriesData(spec.name, spec.aggregation);
+
+ return {
+ data: metricAggregationData?.value ? [['', metricAggregationData.value]] : [],
+ spec: spec
+ };
+ }
+
public buildGroupedTimeseriesData(
spec: AggregatableSpec,
groupByExpressions: AttributeExpression[],
diff --git a/projects/observability/src/shared/dashboard/data/graphql/explore/explore-result.ts b/projects/observability/src/shared/dashboard/data/graphql/explore/explore-result.ts
index 732df3187..e529b54ee 100644
--- a/projects/observability/src/shared/dashboard/data/graphql/explore/explore-result.ts
+++ b/projects/observability/src/shared/dashboard/data/graphql/explore/explore-result.ts
@@ -39,6 +39,10 @@ export class ExploreResult {
);
}
+ public getMetricAggregationSeriesData(metricKey: string, aggregation: MetricAggregationType): MetricAggregationData {
+ return this.extractMetricAggregationForSpec(this.specBuilder.exploreSpecificationForKey(metricKey, aggregation));
+ }
+
public getGroupedTimeSeriesData(
groupExpressions: AttributeExpression[],
metricKey: string,
@@ -64,10 +68,24 @@ export class ExploreResult {
return this.resultsContainingSpec(spec).map(result => this.resultToGroupData(result, groupBySpecs, spec));
}
+ private extractMetricAggregationForSpec(spec: ExploreSpecification): MetricAggregationData {
+ return this.resultToMetricAggregationDataData(this.resultsContainingSpec(spec)?.[0], spec);
+ }
+
private extractTimeseriesForSpec(spec: ExploreSpecification): MetricTimeseriesInterval[] {
return this.resultsToTimeseriesIntervals(this.resultsContainingSpec(spec), spec);
}
+ private resultToMetricAggregationDataData(
+ result: GraphQlExploreResult | undefined,
+ spec: ExploreSpecification
+ ): MetricAggregationData {
+ return {
+ key: spec.name,
+ value: result?.[spec.resultAlias()].value as number
+ };
+ }
+
private resultToGroupData(
result: GraphQlExploreResult,
groupBySpecs: ExploreSpecification[],
@@ -143,3 +161,8 @@ interface GroupData {
keys: string[];
value: number;
}
+
+interface MetricAggregationData {
+ key: string;
+ value: number | undefined;
+}
diff --git a/projects/observability/src/shared/dashboard/widgets/charts/cartesian-widget/axis/cartesian-axis.model.ts b/projects/observability/src/shared/dashboard/widgets/charts/cartesian-widget/axis/cartesian-axis.model.ts
index a0b3f2f26..1b6d074e6 100644
--- a/projects/observability/src/shared/dashboard/widgets/charts/cartesian-widget/axis/cartesian-axis.model.ts
+++ b/projects/observability/src/shared/dashboard/widgets/charts/cartesian-widget/axis/cartesian-axis.model.ts
@@ -37,11 +37,20 @@ export class CartesianAxisModel {
})
public minUpperLimit?: number;
+ @ModelProperty({
+ key: 'show-tick-labels',
+ required: false,
+ displayName: 'Show Tick Labels',
+ type: BOOLEAN_PROPERTY.type
+ })
+ public showTickLabels?: boolean;
+
public getAxisOption(): Partial {
return {
scale: this.scale,
gridLines: this.showGridLines,
- max: this.minUpperLimit
+ max: this.minUpperLimit,
+ tickLabels: this.showTickLabels
};
}
}