| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263 |
- "use strict";
- var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
- return c > 3 && r && Object.defineProperty(target, key, r), r;
- };
- var __rest = (this && this.__rest) || function (s, e) {
- var t = {};
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
- t[p] = s[p];
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
- t[p[i]] = s[p[i]];
- }
- return t;
- };
- var __importDefault = (this && this.__importDefault) || function (mod) {
- return (mod && mod.__esModule) ? mod : { "default": mod };
- };
- Object.defineProperty(exports, "__esModule", { value: true });
- exports.Chart = exports.props = exports.G2_CHART_KEY = void 0;
- const g_1 = require("@antv/g");
- const g_canvas_1 = require("@antv/g-canvas");
- const g_plugin_dragndrop_1 = require("@antv/g-plugin-dragndrop");
- const util_1 = require("@antv/util");
- const event_emitter_1 = __importDefault(require("@antv/event-emitter"));
- const runtime_1 = require("../runtime");
- const event_1 = require("../utils/event");
- const props_1 = require("./props");
- const mark_1 = require("./mark");
- const composition_1 = require("./composition");
- const library_1 = require("./library");
- const utils_1 = require("./utils");
- exports.G2_CHART_KEY = 'G2_CHART_KEY';
- exports.props = [
- { name: 'data', type: 'value' },
- { name: 'width', type: 'value' },
- { name: 'height', type: 'value' },
- { name: 'coordinate', type: 'value' },
- { name: 'interaction', type: 'object' },
- { name: 'theme', type: 'object' },
- { name: 'title', type: 'value' },
- { name: 'transform', type: 'array' },
- { name: 'scale', type: 'object' },
- { name: 'axis', type: 'object' },
- { name: 'legend', type: 'object' },
- { name: 'style', type: 'object' },
- { name: 'labelTransform', type: 'array' },
- ...(0, props_1.nodeProps)(mark_1.mark),
- ...(0, props_1.containerProps)(composition_1.composition),
- ];
- let Chart = class Chart extends composition_1.View {
- constructor(options) {
- const _a = options || {}, { container, canvas, renderer, plugins } = _a, rest = __rest(_a, ["container", "canvas", "renderer", "plugins"]);
- super(rest, 'view');
- // Identifies whether bindAutoFit.
- this._hasBindAutoFit = false;
- this._rendering = false;
- this._trailing = false;
- this._trailingResolve = null;
- this._trailingReject = null;
- this._previousDefinedType = null;
- this._onResize = (0, util_1.debounce)(() => {
- this.forceFit();
- }, 300);
- this._renderer = renderer || new g_canvas_1.Renderer();
- this._plugins = plugins || [];
- this._container = (0, utils_1.normalizeContainer)(container);
- this._emitter = new event_emitter_1.default();
- this._context = { library: library_1.library, emitter: this._emitter, canvas };
- }
- render() {
- if (this._rendering)
- return this._addToTrailing();
- if (!this._context.canvas)
- this._createCanvas();
- this._bindAutoFit();
- this._rendering = true;
- const finished = new Promise((resolve, reject) => (0, runtime_1.render)(this._computedOptions(), this._context, this._createResolve(resolve), this._createReject(reject)));
- const [finished1, resolve, reject] = (0, utils_1.createEmptyPromise)();
- finished
- .then(resolve)
- .catch(reject)
- .then(() => this._renderTrailing());
- return finished1;
- }
- /**
- * @overload
- * @param {G2ViewTree} [options]
- * @returns {Chart|G2ViewTree}
- */
- options(options) {
- if (arguments.length === 0)
- return (0, utils_1.optionsOf)(this);
- const { type } = options;
- if (type)
- this._previousDefinedType = type;
- (0, utils_1.updateRoot)(this, options, this._previousDefinedType);
- return this;
- }
- getContainer() {
- return this._container;
- }
- getContext() {
- return this._context;
- }
- on(event, callback, once) {
- this._emitter.on(event, callback, once);
- return this;
- }
- once(event, callback) {
- this._emitter.once(event, callback);
- return this;
- }
- emit(event, ...args) {
- this._emitter.emit(event, ...args);
- return this;
- }
- off(event, callback) {
- this._emitter.off(event, callback);
- return this;
- }
- clear() {
- const options = this.options();
- this.emit(event_1.ChartEvent.BEFORE_CLEAR);
- this._reset();
- (0, runtime_1.destroy)(options, this._context, false);
- this.emit(event_1.ChartEvent.AFTER_CLEAR);
- }
- destroy() {
- const options = this.options();
- this.emit(event_1.ChartEvent.BEFORE_DESTROY);
- this._unbindAutoFit();
- this._reset();
- (0, runtime_1.destroy)(options, this._context, true);
- (0, utils_1.removeContainer)(this._container);
- this.emit(event_1.ChartEvent.AFTER_DESTROY);
- }
- forceFit() {
- // Don't fit if size do not change.
- this.options['autoFit'] = true;
- const { width, height } = (0, utils_1.sizeOf)(this.options(), this._container);
- if (width === this._width && height === this._height) {
- return Promise.resolve(this);
- }
- // Don't call changeSize to prevent update width and height of options.
- this.emit(event_1.ChartEvent.BEFORE_CHANGE_SIZE);
- const finished = this.render();
- finished.then(() => {
- this.emit(event_1.ChartEvent.AFTER_CHANGE_SIZE);
- });
- return finished;
- }
- changeSize(width, height) {
- if (width === this._width && height === this._height) {
- return Promise.resolve(this);
- }
- this.emit(event_1.ChartEvent.BEFORE_CHANGE_SIZE);
- this.width(width);
- this.height(height);
- const finished = this.render();
- finished.then(() => {
- this.emit(event_1.ChartEvent.AFTER_CHANGE_SIZE);
- });
- return finished;
- }
- _reset() {
- this.type = 'view';
- this.value = {};
- this.children = [];
- }
- _renderTrailing() {
- if (!this._trailing)
- return;
- this._trailing = false;
- this.render()
- .then(() => {
- const trailingResolve = this._trailingResolve.bind(this);
- this._trailingResolve = null;
- trailingResolve(this);
- })
- .catch((error) => {
- const trailingReject = this._trailingReject.bind(this);
- this._trailingReject = null;
- trailingReject(error);
- });
- }
- _createResolve(resolve) {
- return () => {
- this._rendering = false;
- resolve(this);
- };
- }
- _createReject(reject) {
- return (error) => {
- this._rendering = false;
- reject(error);
- };
- }
- // Update actual size and key.
- _computedOptions() {
- const options = this.options();
- const { key = exports.G2_CHART_KEY } = options;
- const { width, height } = (0, utils_1.sizeOf)(options, this._container);
- this._width = width;
- this._height = height;
- this._key = key;
- return Object.assign(Object.assign({ key: this._key }, options), { width, height });
- }
- // Create canvas if it does not exist.
- // DragAndDropPlugin is for interaction.
- // It is OK to register more than one time, G will handle this.
- _createCanvas() {
- const { width, height } = (0, utils_1.sizeOf)(this.options(), this._container);
- this._plugins.push(new g_plugin_dragndrop_1.Plugin());
- this._plugins.forEach((d) => this._renderer.registerPlugin(d));
- this._context.canvas = new g_1.Canvas({
- container: this._container,
- width,
- height,
- renderer: this._renderer,
- });
- }
- _addToTrailing() {
- var _a;
- // Resolve previous promise, and give up this task.
- (_a = this._trailingResolve) === null || _a === void 0 ? void 0 : _a.call(this, this);
- // Create new task.
- this._trailing = true;
- const promise = new Promise((resolve, reject) => {
- this._trailingResolve = resolve;
- this._trailingReject = reject;
- });
- return promise;
- }
- _bindAutoFit() {
- const options = this.options();
- const { autoFit } = options;
- if (this._hasBindAutoFit) {
- // If it was bind before, unbind it now.
- if (!autoFit)
- this._unbindAutoFit();
- return;
- }
- if (autoFit) {
- this._hasBindAutoFit = true;
- window.addEventListener('resize', this._onResize);
- }
- }
- _unbindAutoFit() {
- if (this._hasBindAutoFit) {
- this._hasBindAutoFit = false;
- window.removeEventListener('resize', this._onResize);
- }
- }
- };
- Chart = __decorate([
- (0, props_1.defineProps)(exports.props)
- ], Chart);
- exports.Chart = Chart;
- //# sourceMappingURL=chart.js.map
|