@visactor/vchart 1.1.1 → 1.2.0-beta.1

package/build/index.js

@@ -7937,8 +7937,11 @@
 	    return Logger.getInstance().warn(`[VChart warn]: ${msg}`);
 	};
 	const error$1 = (msg, detail, err) => {
-	    const errIns = new Error(msg);
-	    return Logger.getInstance().error(`[VChart error]: ${errIns}`, detail);
+	    if (isFunction(config.errorHandler)) {
+	        config.errorHandler.call(null, msg, detail);
+	        return;
+	    }
+	    throw new Error(msg);
 	};
 	const config = {
 	    silent: false,
@@ -8341,7 +8344,8 @@
 	function min$2(data, field) {
 	    const initialData = field ? +data[0][field] : +data[0];
 	    if (!isValidNumber(initialData)) {
-	        throw new Error('invalid data');
+	        warn('invalid data');
+	        return 0;
 	    }
 	    const min = data.reduce((pre, _cur) => {
 	        const cur = field ? +_cur[field] : +_cur;
@@ -8355,7 +8359,8 @@
 	function max$2(data, field) {
 	    const initialData = field ? +data[0][field] : +data[0];
 	    if (!isValidNumber(initialData)) {
-	        throw new Error('invalid data');
+	        warn('invalid data');
+	        return 0;
 	    }
 	    const max = data.reduce((pre, _cur) => {
 	        const cur = field ? +_cur[field] : +_cur;
@@ -51514,6 +51519,8 @@
 	(function (ChartEvent) {
 	    ChartEvent["initialized"] = "initialized";
 	    ChartEvent["rendered"] = "rendered";
+	    ChartEvent["renderFinished"] = "renderFinished";
+	    ChartEvent["animationFinished"] = "animationFinished";
 	    ChartEvent["regionSeriesDataFilterOver"] = "regionSeriesDataFilterOver";
 	    ChartEvent["afterInitData"] = "afterInitData";
 	    ChartEvent["afterInitEvent"] = "afterInitEvent";
@@ -53461,10 +53468,10 @@
 	        this._chart = this._eventDispatcher.globalInstance.getChart?.();
 	    }
 	    register(eType, handler) {
-	        throw new Error('Method not implemented.');
+	        (this._chart?.getOption().onError ?? error$1)('Method not implemented.');
 	    }
 	    unregister() {
-	        throw new Error('Method not implemented.');
+	        (this._chart?.getOption().onError ?? error$1)('Method not implemented.');
 	    }
 	    getTargetDimensionInfo(x, y) {
 	        const cartesianInfo = getCartesianDimensionInfo(this._chart, { x, y }) ?? [];
@@ -54101,7 +54108,7 @@
 	    });
 	    return viewData;
 	}
-	function dataToDataView(data, dataSet, sourceDataViews = []) {
+	function dataToDataView(data, dataSet, sourceDataViews = [], ctx = {}) {
 	    if (data instanceof DataView) {
 	        return data;
 	    }
@@ -54120,7 +54127,8 @@
 	        if (typeof fromDataId === 'string') {
 	            const fromDataView = sourceDataViews.find(dv => dv.name === fromDataId);
 	            if (!fromDataView) {
-	                throw new Error(`no data matches fromDataId ${fromDataId}`);
+	                (ctx.onError ?? error$1)(`no data matches fromDataId ${fromDataId}`);
+	                return null;
 	            }
 	            dataView.parse([fromDataView], {
 	                type: 'dataview'
@@ -54132,7 +54140,8 @@
 	        else if (typeof fromDataIndex === 'number') {
 	            const fromDataView = sourceDataViews[fromDataIndex];
 	            if (!fromDataView) {
-	                throw new Error(`no data matches fromDataIndex ${fromDataIndex}`);
+	                (ctx.onError ?? error$1)(`no data matches fromDataIndex ${fromDataIndex}`);
+	                return null;
 	            }
 	            dataView.parse([fromDataView], {
 	                type: 'dataview'
@@ -54150,7 +54159,7 @@
 	        }
 	        else {
 	            dataView.parse([]);
-	            error$1('values should be array');
+	            warn('values should be array');
 	        }
 	        if (transforms && transforms.length) {
 	            transforms.forEach((transform) => {
@@ -54287,6 +54296,12 @@
 	        if (this._view) {
 	            return;
 	        }
+	        const logger = new Logger(this._option.logLevel ?? LoggerLevel.Error);
+	        if (this._option.onError) {
+	            logger.addErrorHandler((...args) => {
+	                this._option.onError(...args);
+	            });
+	        }
 	        this._view = new View({
 	            width: this._width,
 	            height: this._height,
@@ -54306,7 +54321,8 @@
 	            doLayout: () => {
 	                this._compileChart?.onLayout(this._view);
 	            },
-	            logLevel: Logger.getInstance().level()
+	            logger: logger,
+	            logLevel: logger.level()
 	        });
 	        this._setCanvasStyle();
 	        const interactive = this._option.interactive;
@@ -54560,7 +54576,7 @@
 	        });
 	    });
 	}
-	async function getCanvasDataURL(c) {
+	async function getCanvasDataURL(c, ctx) {
 	    if (!c) {
 	        return '';
 	    }
@@ -54569,8 +54585,8 @@
 	            return OffscreenCanvasToDataURL(c);
 	        }
 	    }
-	    catch (error) {
-	        console.error('getCanvasDataURL', error);
+	    catch (_error) {
+	        (ctx?.onError ?? error$1)(`getCanvasDataURL error : ${_error.toString()}`);
 	    }
 	    return c.toDataURL();
 	}
@@ -54631,15 +54647,20 @@
 	    _autoSize = true;
 	    _option = {
 	        mode: exports.RenderModeEnum['desktop-browser'],
-	        animation: true
+	        animation: true,
+	        onError: (msg) => {
+	            throw new Error(msg);
+	        }
 	    };
 	    _curSize = { width: 0, height: 0 };
 	    _observer = null;
 	    _currentThemeName;
 	    _currentTheme;
+	    _onError;
 	    _context = {};
 	    constructor(spec, options) {
 	        this._option = merge$2(this._option, options);
+	        this._onError = this._option.onError;
 	        const { dom, renderCanvas, mode, stage, poptip, ...restOptions } = this._option;
 	        if (dom) {
 	            this._container = isString(dom) ? document?.getElementById(dom) : dom;
@@ -54651,7 +54672,7 @@
 	            this._stage = stage;
 	        }
 	        if (mode !== 'node' && !this._container && !this._canvas && !this._stage) {
-	            error$1('please specify container or renderCanvas!');
+	            this._option.onError('please specify container or renderCanvas!');
 	            return;
 	        }
 	        this._viewBox = this._option.viewBox;
@@ -54666,7 +54687,8 @@
 	            stage,
 	            pluginList: poptip !== false ? ['poptipForText'] : [],
 	            ...restOptions,
-	            background: spec.background || this._currentTheme.background || this._option.background
+	            background: spec.background || this._currentTheme.background || this._option.background,
+	            onError: this._onError
 	        });
 	        this._eventDispatcher = new EventDispatcher(this, this._compiler);
 	        this._event = new Event$1(this._eventDispatcher, mode);
@@ -54681,6 +54703,7 @@
 	            height: spec.height || 0
 	        };
 	        this._bindResizeEvent();
+	        this._bindVGrammarViewEvent();
 	        this._event.emit(ChartEvent.initialized, {});
 	        InstanceManager.registerInstance(this);
 	    }
@@ -54699,13 +54722,15 @@
 	        const dataViewArr = [];
 	        for (let i = 0; i < specData.length; i++) {
 	            const curSpecData = specData[i];
-	            dataViewArr.push(dataToDataView(curSpecData, this._dataSet, dataViewArr));
+	            dataViewArr.push(dataToDataView(curSpecData, this._dataSet, dataViewArr, {
+	                onError: this._option.onError
+	            }));
 	        }
 	        this._spec.data = dataViewArr;
 	    }
 	    _initChart(spec) {
 	        if (!this._compiler) {
-	            error$1('compiler is not initialized');
+	            this._option.onError('compiler is not initialized');
 	            return;
 	        }
 	        this._initData();
@@ -54723,10 +54748,11 @@
 	            viewBox: this._viewBox,
 	            animation: this._option.animation,
 	            getTheme: () => this._currentTheme,
-	            layout: this._option.layout
+	            layout: this._option.layout,
+	            onError: this._onError
 	        });
 	        if (!chart) {
-	            error$1('init chart fail');
+	            this._option.onError('init chart fail');
 	            return;
 	        }
 	        this._chart = chart;
@@ -54739,6 +54765,17 @@
 	            this._dataSet = null;
 	        }
 	    }
+	    _bindVGrammarViewEvent() {
+	        if (!this._compiler || this._compiler.isReleased) {
+	            return;
+	        }
+	        this._compiler.getVGrammarView().addEventListener(HOOK_EVENT.ALL_ANIMATION_END, () => {
+	            this._event.emit(ChartEvent.animationFinished, {});
+	        });
+	        this._compiler.getVGrammarView().addEventListener(HOOK_EVENT.AFTER_VRENDER_NEXT_RENDER, () => {
+	            this._event.emit(ChartEvent.renderFinished, {});
+	        });
+	    }
 	    _bindResizeEvent() {
 	        if (this._autoSize) {
 	            if (this._container) {
@@ -54790,7 +54827,21 @@
 	        if (!isValid(result)) {
 	            return this;
 	        }
-	        if (result.reMake) {
+	        this._reCompile(result);
+	        await this.renderAsync(morphConfig);
+	        return this;
+	    }
+	    updateCustomConfigAndRerenderSync(modifyConfig, morphConfig) {
+	        const result = modifyConfig();
+	        if (!isValid(result)) {
+	            return this;
+	        }
+	        this._reCompile(result);
+	        this.renderSync(morphConfig);
+	        return this;
+	    }
+	    _reCompile(updateResult) {
+	        if (updateResult.reMake) {
 	            this._releaseData();
 	            this._initDataSet();
 	            this._chart.release();
@@ -54798,13 +54849,11 @@
 	            this._compiler?.releaseGrammar();
 	        }
 	        else {
-	            if (result.reCompile) {
+	            if (updateResult.reCompile) {
 	                this.getComponents().forEach(c => c.clear());
 	                this._compiler?.compile({ chart: this._chart, vChart: this }, {});
 	            }
 	        }
-	        await this.renderAsync(morphConfig);
-	        return this;
 	    }
 	    renderSync(morphConfig) {
 	        if (!this._chart) {
@@ -54964,6 +55013,25 @@
 	        }, morphConfig);
 	        return this;
 	    }
+	    updateSpecSync(spec, forceMerge = false, morphConfig) {
+	        if (!spec) {
+	            return this;
+	        }
+	        if (isString(spec)) {
+	            spec = JSON.parse(spec);
+	        }
+	        if (forceMerge) {
+	            spec = merge$2({}, this._spec, spec);
+	        }
+	        this.updateCustomConfigAndRerenderSync(() => {
+	            spec = specTransform(spec);
+	            this._spec = spec;
+	            this._updateCurrentTheme();
+	            this._compiler?.getVGrammarView()?.updateLayoutTag();
+	            return this._chart.updateSpec(spec, morphConfig);
+	        }, morphConfig);
+	        return this;
+	    }
 	    async resize(width, height) {
 	        if (!this._chart || !this._compiler) {
 	            return this;
@@ -55041,6 +55109,18 @@
 	        });
 	        return this;
 	    }
+	    setCurrentThemeSync(name) {
+	        if (!ThemeManager.themeExist(name)) {
+	            return this;
+	        }
+	        this.updateCustomConfigAndRerenderSync(() => {
+	            this._currentThemeName = name;
+	            this._updateCurrentTheme();
+	            this._chart?.setCurrentTheme(this._currentTheme, true);
+	            return { change: true, reMake: false };
+	        });
+	        return this;
+	    }
 	    _getTooltipComponent() {
 	        const tooltip = this._chart?.getAllComponents().find(c => c.type === ComponentTypeEnum.tooltip);
 	        return tooltip;
@@ -55122,15 +55202,17 @@
 	        if (this._chart && stage) {
 	            stage.render();
 	            const canvas = this._chart.getCanvas();
-	            const url = await getCanvasDataURL(canvas);
+	            const url = await getCanvasDataURL(canvas, {
+	                onError: this._onError
+	            });
 	            return url;
 	        }
-	        console.error(new ReferenceError(`render is not defined`));
+	        this._option.onError(new ReferenceError(`render is not defined`));
 	        return null;
 	    }
 	    async exportImg(name) {
 	        if (!isTrueBrowser(this._option.mode)) {
-	            console.error(new TypeError(`non-browser environment can not export img`));
+	            this._option.onError(new TypeError(`non-browser environment can not export img`));
 	            return;
 	        }
 	        const dataURL = await this.getDataURL();
@@ -55138,12 +55220,12 @@
 	            URLToImage(name, dataURL);
 	        }
 	        else {
-	            console.error(new ReferenceError(`render is not defined`));
+	            this._option.onError(new ReferenceError(`render is not defined`));
 	        }
 	    }
 	    getImageBuffer() {
 	        if (this._option.mode !== 'node') {
-	            console.error(new TypeError('getImageBuffer() now only support node environment.'));
+	            this._option.onError(new TypeError('getImageBuffer() now only support node environment.'));
 	            return;
 	        }
 	        const stage = this.getStage();
@@ -55152,7 +55234,7 @@
 	            const buffer = stage.window.getImageBuffer();
 	            return buffer;
 	        }
-	        console.error(new ReferenceError(`render is not defined`));
+	        this._option.onError(new ReferenceError(`render is not defined`));
 	        return null;
 	    }
 	    setLayout(layout) {
@@ -56679,6 +56761,10 @@
 	    _bottomCurrent = 0;
 	    _chartLayoutRect;
 	    _chartViewBox;
+	    _onError;
+	    constructor(_spec, ctx) {
+	        this._onError = ctx?.onError;
+	    }
 	    layoutItems(_chart, items, chartLayoutRect, chartViewBox) {
 	        this._chartLayoutRect = chartLayoutRect;
 	        this._chartViewBox = chartViewBox;
@@ -56939,7 +57025,7 @@
 	    filterRegionsWithID(regions, id) {
 	        const target = regions.find(x => x.id === id);
 	        if (!target) {
-	            throw Error('can not find target region item, invalid id');
+	            (this._onError ?? error$1)('can not find target region item, invalid id');
 	        }
 	        return target;
 	    }
@@ -58033,7 +58119,7 @@
 	VChart.useMark([ComponentMark, GroupMark, ImageMark]);
 	Factory.registerRegion('region', Region);
 	Factory.registerLayout('base', Layout);
-	const version = "1.1.1";
+	const version = "1.2.0-beta.1";
 	Logger.getInstance(LoggerLevel.Error);
 
 	var SeriesMarkNameEnum;
@@ -58522,6 +58608,9 @@
 	        this.transformSpec(s);
 	        this._spec = s;
 	    }
+	    getOption() {
+	        return this._option;
+	    }
 	    _theme;
 	    _regions = [];
 	    _series = [];
@@ -58589,7 +58678,8 @@
 	            getChartLayoutRect: () => this._layoutRect,
 	            getChartViewRect: () => this._viewRect,
 	            getChart: () => this,
-	            globalScale: this._globalScale
+	            globalScale: this._globalScale,
+	            onError: this._option.onError
 	        };
 	        this._stack = new Stack(this);
 	        this._spec = spec;
@@ -58658,7 +58748,9 @@
 	                spec.data = this.getSeriesData(spec.dataId, spec.dataIndex);
 	            }
 	            else {
-	                spec.data = dataToDataView(spec.data, this._dataSet, this._spec.data);
+	                spec.data = dataToDataView(spec.data, this._dataSet, this._spec.data, {
+	                    onError: this._option.onError
+	                });
 	            }
 	            if (this._option.animation === false) {
 	                spec.animation = false;
@@ -58777,7 +58869,9 @@
 	            if (this._spec.zField || (this._spec.series && this._spec.series.some((s) => s.zField))) {
 	                use3dLayout = true;
 	            }
-	            const layout = new (Factory.getLayout(this._spec.layout?.type ?? (use3dLayout ? 'layout3d' : 'base')))(this._spec.layout);
+	            const layout = new (Factory.getLayout(this._spec.layout?.type ?? (use3dLayout ? 'layout3d' : 'base')))(this._spec.layout, {
+	                onError: this._option.onError
+	            });
 	            this._layoutFunc = layout.layoutItems.bind(layout);
 	        }
 	    }
@@ -58995,7 +59089,8 @@
 	    }
 	    getSeriesData(id, index) {
 	        if (!this._spec.data) {
-	            throw new Error('no data in spec!');
+	            this._option.onError('no data in spec!');
+	            return null;
 	        }
 	        if (typeof id === 'string') {
 	            const metchData = this._spec.data.filter((data) => {
@@ -59004,13 +59099,15 @@
 	            if (metchData[0]) {
 	                return metchData[0];
 	            }
-	            throw new Error(`no data matches dataId ${id}!`);
+	            this._option.onError(`no data matches dataId ${id}!`);
+	            return null;
 	        }
 	        if (typeof index === 'number') {
 	            if (this._spec.data[index]) {
 	                return this._spec.data[index];
 	            }
-	            throw new Error(`no data matches dataIndex ${index}!`);
+	            this._option.onError(`no data matches dataIndex ${index}!`);
+	            return null;
 	        }
 	        return this._spec.data[0];
 	    }
@@ -61068,7 +61165,7 @@
 	        if (isFunction(dataKey)) {
 	            return dataKey(datum, index);
 	        }
-	        throw new Error(`invalid dataKey: ${dataKey}`);
+	        this._option.onError(`invalid dataKey: ${dataKey}`);
 	    }
 	    _addDataIndexAndKey() {
 	        if (this._rawData?.dataSet) {
@@ -65015,13 +65112,16 @@
 	    longitudeToData(lon) {
 	    }
 	    dataToPositionX(data) {
-	        throw new Error('Method not implemented.');
+	        this._option.onError('Method not implemented.');
+	        return 0;
 	    }
 	    dataToPositionY(data) {
-	        throw new Error('Method not implemented.');
+	        this._option.onError('Method not implemented.');
+	        return 0;
 	    }
 	    dataToPositionZ(data) {
-	        throw new Error('Method not implemented.');
+	        this._option.onError('Method not implemented.');
+	        return 0;
 	    }
 	    release() {
 	        super.release();
@@ -65136,10 +65236,10 @@
 	        this._valueField = this._spec.valueField;
 	        this._spec.nameProperty && (this._nameProperty = this._spec.nameProperty);
 	        if (!this.map) {
-	            throw new Error(`map type '${this.map}' is not specified !`);
+	            this._option.onError(`map type '${this.map}' is not specified !`);
 	        }
 	        if (!geoSourceMap.get(this.map)) {
-	            throw new Error(`'${this.map}' data is not registered !`);
+	            this._option.onError(`'${this.map}' data is not registered !`);
 	        }
 	    }
 	    initData() {
@@ -65149,7 +65249,7 @@
 	        registerDataSetInstanceTransform(this._dataSet, 'lookup', lookup);
 	        const features = geoSourceMap.get(this.map);
 	        if (!features) {
-	            throw Error('no valid map data found!');
+	            this._option.onError('no valid map data found!');
 	        }
 	        const mapData = new DataView(this._dataSet);
 	        mapData
@@ -65355,10 +65455,12 @@
 	        return '';
 	    }
 	    dataToPositionX(data) {
-	        throw new Error('Method not implemented.');
+	        this._option.onError('Method not implemented.');
+	        return 0;
 	    }
 	    dataToPositionY(data) {
-	        throw new Error('Method not implemented.');
+	        this._option.onError('Method not implemented.');
+	        return 0;
 	    }
 	    viewDataUpdate(d) {
 	        super.viewDataUpdate(d);
@@ -66905,10 +67007,12 @@
 	        }
 	        if (isArray$3(spec)) {
 	            if (isNil(field)) {
-	                throw new Error(`${key}Field is required.`);
+	                this._option.onError(`${key}Field is required.`);
+	                return spec;
 	            }
 	            if (spec.length > 2) {
-	                throw new Error(`${key} length is invalid, specify up to 2 ${key}s.`);
+	                this._option.onError(`${key} length is invalid, specify up to 2 ${key}s.`);
+	                return spec;
 	            }
 	            const scaleName = `${PREFIX}_series_scatter_${this.id}_scale_${key}`;
 	            this._option.globalScale.registerModelScale({
@@ -66929,7 +67033,8 @@
 	        }
 	        if (isObject$f(spec)) {
 	            if (isNil(field)) {
-	                throw new Error(`${key}Field is required.`);
+	                this._option.onError(`${key}Field is required.`);
+	                return spec;
 	            }
 	            const scaleName = `${PREFIX}_series_scatter_${this.id}_scale_${key}`;
 	            const visualSpec = {
@@ -66950,7 +67055,8 @@
 	                field
 	            };
 	        }
-	        throw new Error(`${key} attribute is invalid.`);
+	        this._option.onError(`${key} attribute is invalid.`);
+	        return spec;
 	    }
 	    getSizeAttribute(field, sizeSpec) {
 	        if (isNil(sizeSpec)) {
@@ -76989,9 +77095,13 @@
 	                }
 	            }
 	            else {
-	                spec.data = dataToDataView(spec.data, this._dataSet, this._spec.data);
+	                spec.data = dataToDataView(spec.data, this._dataSet, this._spec.data, {
+	                    onError: this._option.onError
+	                });
 	                if (spec.type === SeriesTypeEnum.link) {
-	                    spec.dataDot = dataToDataView(this._spec.series[spec.dotSeriesIndex].data, this._dataSet, this._spec.data);
+	                    spec.dataDot = dataToDataView(this._spec.series[spec.dotSeriesIndex].data, this._dataSet, this._spec.data, {
+	                        onError: this._option.onError
+	                    });
 	                }
 	            }
 	            if (spec.type === SeriesTypeEnum.link) {
@@ -80462,7 +80572,8 @@
 	                inverse
 	            }, options);
 	        }
-	        throw `Component ${componentName} not found`;
+	        options.onError(`Component ${componentName} not found`);
+	        return null;
 	    }
 	    static createComponent(spec, options) {
 	        if (!this.type.startsWith(CartesianAxis.type)) {
@@ -81470,7 +81581,8 @@
 	        if (C) {
 	            return new C(spec, options);
 	        }
-	        throw `Component ${componentName} not found`;
+	        options.onError(`Component ${componentName} not found`);
+	        return null;
 	    }
 	    static createComponent(spec, options) {
 	        if (!this.type.startsWith(PolarAxis.type)) {
@@ -82966,9 +83078,6 @@
 	    projection;
 	    constructor(projectionSpec) {
 	        this.projection = projection(projectionSpec.type)();
-	        if (this.projection === null) {
-	            throw Error('unsupported projection type!');
-	        }
 	    }
 	    fit(start, size, features) {
 	        const fitData = { type: 'FeatureCollection', features };
@@ -83119,6 +83228,10 @@
 	    }
 	    initProjection() {
 	        this._projection = new Projection(this._projectionSpec);
+	        if (this._projection.projection === null) {
+	            this._option.onError('unsupported projection type!');
+	            return;
+	        }
 	    }
 	    coordinateHelper() {
 	        const helper = {
@@ -85186,7 +85299,8 @@
 	                }
 	            }
 	        }
-	        throw new Error('need at least one series');
+	        this._option.onError('need at least one series');
+	        return null;
 	    }
 	    clear() {
 	        if (this._markerComponent) {
@@ -88227,6 +88341,12 @@
 	            });
 	        });
 	    }
+	    updateSpec(spec) {
+	        const result = super.updateSpec(spec);
+	        result.reRender = true;
+	        result.reMake = true;
+	        return result;
+	    }
 	    onRender(ctx) {
 	    }
 	    changeRegions(regions) {
@@ -88253,7 +88373,8 @@
 	    _rowElements;
 	    _gridInfo;
 	    _elementMap = new Map();
-	    constructor(gridInfo) {
+	    _onError;
+	    constructor(gridInfo, ctx) {
 	        this.standardizationSpec(gridInfo);
 	        this._gridInfo = gridInfo;
 	        this._col = gridInfo.col;
@@ -88262,6 +88383,7 @@
 	        this._rowSize = new Array(this._row).fill(null);
 	        this._colElements = new Array(this._col).fill([]);
 	        this._rowElements = new Array(this._row).fill([]);
+	        this._onError = ctx?.onError;
 	        this.initUserSetting();
 	    }
 	    standardizationSpec(gridInfo) {