Handle errors when chart is invalid for given data (#1226)

This commit is contained in:
Matt Irvine
2018-04-23 16:38:18 -07:00
committed by GitHub
parent 08d73675d4
commit f63da13210
3 changed files with 21 additions and 4 deletions

View File

@@ -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 });
} }

View File

@@ -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;

View File

@@ -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;