swOperation/node_modules/@antv/g2/lib/runtime/render.js

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.destroy = exports.renderToMountedElement = exports.render = 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 stdlib_1 = require("../stdlib");
const selection_1 = require("../utils/selection");
const event_1 = require("../utils/event");
const helper_1 = require("../utils/helper");
const plot_1 = require("./plot");
const constant_1 = require("./constant");
/**
 * Infer key for each node of view tree.
 * Each key should be unique in the entire view tree.
 * The key is for incremental render when view tree is changed.
 * @todo Fix custom key equals to inferred key.
 */
function inferKeys(options) {
    const root = (0, util_1.deepMix)({}, options);
    const nodeParent = new Map([[root, null]]);
    const nodeIndex = new Map([[null, -1]]);
    const discovered = [root];
    while (discovered.length) {
        const node = discovered.shift();
        // If key of node is not specified, using parentKey and the index for it
        // in parent.children as its key.
        // e.g. The key of node named 'a' will be 'a', and the key of node named
        // 'b' will be 'parent-1' in the following view tree specification.
        // { key: 'parent', children: [{ name: 'a', key: 'a' }, { name: 'b' }] }
        if (node.key === undefined) {
            const parent = nodeParent.get(node);
            const index = nodeIndex.get(node);
            const key = parent === null ? `${0}` : `${parent.key}-${index}`;
            node.key = key;
        }
        const { children = [] } = node;
        if (Array.isArray(children)) {
            for (let i = 0; i < children.length; i++) {
                // Clone node as well.
                const child = (0, util_1.deepMix)({}, children[i]);
                children[i] = child;
                nodeParent.set(child, node);
                nodeIndex.set(child, i);
                discovered.push(child);
            }
        }
    }
    return root;
}
function Canvas(width, height) {
    const renderer = new g_canvas_1.Renderer();
    // DragAndDropPlugin is for interaction.
    renderer.registerPlugin(new g_plugin_dragndrop_1.Plugin());
    return new g_1.Canvas({
        width,
        height,
        container: document.createElement('div'),
        renderer: renderer,
    });
}
function render(options, context = {}, resolve = () => { }, reject = (e) => {
    throw e;
}) {
    // Initialize the context if it is not provided.
    const { width = 640, height = 480, theme } = options;
    if (!theme) {
        (0, helper_1.error)('ChartOptions.theme is required, such as `const chart = new Chart({ theme: "classic"})`.');
    }
    const keyed = inferKeys(options);
    const { canvas = Canvas(width, height), library = (0, stdlib_1.createLibrary)(), emitter = new event_emitter_1.default(), } = context;
    context.canvas = canvas;
    context.library = library;
    context.emitter = emitter;
    canvas.resize(width, height);
    emitter.emit(event_1.ChartEvent.BEFORE_RENDER);
    // Plot the chart and mutate context.
    // Make sure that plot chart after container is ready for every time.
    const selection = (0, selection_1.select)(canvas.document.documentElement);
    canvas.ready
        .then(() => (0, plot_1.plot)(Object.assign(Object.assign({}, keyed), { width, height }), selection, library, context))
        .then(() => {
        // Wait for the next tick.
        canvas.requestAnimationFrame(() => {
            emitter.emit(event_1.ChartEvent.AFTER_RENDER);
            resolve === null || resolve === void 0 ? void 0 : resolve();
        });
    })
        .catch((e) => {
        reject === null || reject === void 0 ? void 0 : reject(e);
    });
    // Return the container HTML element wraps the canvas or svg element.
    return normalizeContainer(canvas.getConfig().container);
}
exports.render = render;
function renderToMountedElement(options, context = {}, resolve = () => { }, reject = (e) => {
    throw e;
}) {
    // Initialize the context if it is not provided.
    const { width = 640, height = 480, on } = options;
    const keyed = inferKeys(options);
    const { library = (0, stdlib_1.createLibrary)(), group = new g_1.Group(), emitter = new event_emitter_1.default(), } = context;
    if (!(group === null || group === void 0 ? void 0 : group.parentElement)) {
        (0, helper_1.error)(`renderToMountedElement can't render chart to unmounted group.`);
    }
    const selection = (0, selection_1.select)(group);
    context.group = group;
    context.library = library;
    context.emitter = emitter;
    emitter.emit(event_1.ChartEvent.BEFORE_RENDER);
    // Plot the chart and mutate context.
    // Make sure that plot chart after container is ready for every time.
    (0, plot_1.plot)(Object.assign(Object.assign({}, keyed), { width, height }), selection, library, context)
        .then(() => {
        const canvas = group.ownerDocument.defaultView;
        canvas.requestAnimationFrame(() => {
            emitter.emit(event_1.ChartEvent.AFTER_RENDER);
            resolve === null || resolve === void 0 ? void 0 : resolve();
        });
    })
        .catch((e) => {
        reject === null || reject === void 0 ? void 0 : reject(e);
    });
    // Return the Group wraps the canvas or svg element.
    return group;
}
exports.renderToMountedElement = renderToMountedElement;
function destroy(options, context = {}, isDestroyCanvas = false) {
    const { canvas, emitter } = context;
    if (canvas) {
        destroyAllInteractions(canvas);
        isDestroyCanvas ? canvas.destroy() : canvas.destroyChildren();
    }
    emitter.off();
}
exports.destroy = destroy;
/**
 * Destroy all interactions mounted on the canvas.
 */
function destroyAllInteractions(canvas) {
    const viewGroups = canvas.getRoot().querySelectorAll(`.${constant_1.VIEW_CLASS_NAME}`);
    viewGroups === null || viewGroups === void 0 ? void 0 : viewGroups.forEach((group) => {
        const { nameInteraction = new Map() } = group;
        if ((nameInteraction === null || nameInteraction === void 0 ? void 0 : nameInteraction.size) > 0) {
            Array.from(nameInteraction === null || nameInteraction === void 0 ? void 0 : nameInteraction.values()).forEach((value) => {
                value === null || value === void 0 ? void 0 : value.destroy();
            });
        }
    });
}
function normalizeContainer(container) {
    return typeof container === 'string'
        ? document.getElementById(container)
        : container;
}
//# sourceMappingURL=render.js.map