mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-02-16 18:46:40 -05:00
Handle errors when chart is invalid for given data (#1226)
This commit is contained in:
@@ -20,6 +20,7 @@ import { Color } from 'vs/base/common/color';
|
|||||||
import * as types from 'vs/base/common/types';
|
import * as types from 'vs/base/common/types';
|
||||||
import { Disposable } from 'vs/base/common/lifecycle';
|
import { Disposable } from 'vs/base/common/lifecycle';
|
||||||
import { IColorTheme } from 'vs/workbench/services/themes/common/workbenchThemeService';
|
import { IColorTheme } from 'vs/workbench/services/themes/common/workbenchThemeService';
|
||||||
|
import * as nls from 'vs/nls';
|
||||||
|
|
||||||
export enum ChartType {
|
export enum ChartType {
|
||||||
Bar = 'bar',
|
Bar = 'bar',
|
||||||
@@ -98,11 +99,13 @@ export const defaultChartConfig: IChartConfig = {
|
|||||||
[chartType]="chartType"
|
[chartType]="chartType"
|
||||||
[colors]="colors"
|
[colors]="colors"
|
||||||
[options]="_options"></canvas>
|
[options]="_options"></canvas>
|
||||||
|
<div *ngIf="_hasError">{{CHART_ERROR_MESSAGE}}</div>
|
||||||
</div>`
|
</div>`
|
||||||
})
|
})
|
||||||
export abstract class ChartInsight extends Disposable implements IInsightsView {
|
export abstract class ChartInsight extends Disposable implements IInsightsView {
|
||||||
private _isDataAvailable: boolean = false;
|
private _isDataAvailable: boolean = false;
|
||||||
private _hasInit: boolean = false;
|
private _hasInit: boolean = false;
|
||||||
|
private _hasError: boolean = false;
|
||||||
private _options: any = {};
|
private _options: any = {};
|
||||||
|
|
||||||
@ViewChild(BaseChartDirective) private _chart: BaseChartDirective;
|
@ViewChild(BaseChartDirective) private _chart: BaseChartDirective;
|
||||||
@@ -111,6 +114,8 @@ export abstract class ChartInsight extends Disposable implements IInsightsView {
|
|||||||
protected _config: IChartConfig;
|
protected _config: IChartConfig;
|
||||||
protected _data: IInsightData;
|
protected _data: IInsightData;
|
||||||
|
|
||||||
|
private readonly CHART_ERROR_MESSAGE = nls.localize('chartErrorMessage', 'Chart cannot be displayed with the given data');
|
||||||
|
|
||||||
protected abstract get chartType(): ChartType;
|
protected abstract get chartType(): ChartType;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
@@ -129,7 +134,14 @@ export abstract class ChartInsight extends Disposable implements IInsightsView {
|
|||||||
// hence it's easier to not render until ready
|
// hence it's easier to not render until ready
|
||||||
this.options = mixin(this.options, { maintainAspectRatio: false });
|
this.options = mixin(this.options, { maintainAspectRatio: false });
|
||||||
this._hasInit = true;
|
this._hasInit = true;
|
||||||
this._changeRef.detectChanges();
|
this._hasError = false;
|
||||||
|
try {
|
||||||
|
this._changeRef.detectChanges();
|
||||||
|
} catch (err) {
|
||||||
|
this._hasInit = false;
|
||||||
|
this._hasError = true;
|
||||||
|
this._changeRef.detectChanges();
|
||||||
|
}
|
||||||
TelemetryUtils.addTelemetry(this._bootstrapService.telemetryService, TelemetryKeys.ChartCreated, { type: this.chartType });
|
TelemetryUtils.addTelemetry(this._bootstrapService.telemetryService, TelemetryKeys.ChartCreated, { type: this.chartType });
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -27,7 +27,7 @@ const defaultConfig: IConfig = {
|
|||||||
})
|
})
|
||||||
export default class ImageInsight implements IInsightsView, OnInit {
|
export default class ImageInsight implements IInsightsView, OnInit {
|
||||||
private _rawSource: string;
|
private _rawSource: string;
|
||||||
private _config: IConfig;
|
private _config: IConfig = defaultConfig;
|
||||||
|
|
||||||
@ViewChild('image') private image: ElementRef;
|
@ViewChild('image') private image: ElementRef;
|
||||||
@ViewChild('container') private container: ElementRef;
|
@ViewChild('container') private container: ElementRef;
|
||||||
|
|||||||
@@ -97,14 +97,18 @@ export class ChartViewerComponent implements OnInit, OnDestroy, IChartViewAction
|
|||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
|
this.setDefaultChartConfig();
|
||||||
|
this.legendOptions = Object.values(LegendPosition);
|
||||||
|
this.initializeUI();
|
||||||
|
}
|
||||||
|
|
||||||
|
private setDefaultChartConfig() {
|
||||||
this._chartConfig = <ILineConfig>{
|
this._chartConfig = <ILineConfig>{
|
||||||
dataDirection: 'vertical',
|
dataDirection: 'vertical',
|
||||||
dataType: 'number',
|
dataType: 'number',
|
||||||
legendPosition: 'none',
|
legendPosition: 'none',
|
||||||
labelFirstColumn: false
|
labelFirstColumn: false
|
||||||
};
|
};
|
||||||
this.legendOptions = Object.values(LegendPosition);
|
|
||||||
this.initializeUI();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
private initializeUI() {
|
private initializeUI() {
|
||||||
@@ -169,6 +173,7 @@ export class ChartViewerComponent implements OnInit, OnDestroy, IChartViewAction
|
|||||||
|
|
||||||
|
|
||||||
public onChartChanged(): void {
|
public onChartChanged(): void {
|
||||||
|
this.setDefaultChartConfig();
|
||||||
if ([Constants.chartTypeScatter, Constants.chartTypeTimeSeries].some(item => item === this.chartTypesSelectBox.value)) {
|
if ([Constants.chartTypeScatter, Constants.chartTypeTimeSeries].some(item => item === this.chartTypesSelectBox.value)) {
|
||||||
this.dataType = DataType.Point;
|
this.dataType = DataType.Point;
|
||||||
this.dataDirection = DataDirection.Horizontal;
|
this.dataDirection = DataDirection.Horizontal;
|
||||||
|
|||||||
Reference in New Issue
Block a user