@visactor/vchart/esm/plugin/vchart/rotate/rotate.js

charts lib based @visactor/VGrammar

import { BasePlugin } from "../../base/base-plugin";

import { registerVChartPlugin } from "../register";

import { matrixAllocate, transformPointForCanvas, mapToCanvasPointForCanvas, registerGlobalEventTransformer, registerWindowEventTransformer, vglobal } from "@visactor/vrender-core";

export class RotatePlugin extends BasePlugin {
    constructor() {
        super(RotatePlugin.type), this.type = "rotatePlugin", this.rotate90WithTransform = rotateDom => {
            this.rotateDegree = 90;
            const rotateCenter = rotateDom.clientWidth < rotateDom.clientHeight ? Math.max(rotateDom.clientWidth, rotateDom.clientHeight) / 2 : Math.min(rotateDom.clientWidth, rotateDom.clientHeight) / 2, domRect = this._vchart.getContainer().getBoundingClientRect(), x1 = domRect.left, y1 = domRect.top, x2 = domRect.right, y2 = domRect.bottom;
            rotateDom.style.transform = "rotate(90deg)", rotateDom.style.transformOrigin = `${rotateCenter}px ${rotateCenter}px`;
            const getRect = () => ({
                x1: x1,
                y1: y1,
                x2: x2,
                y2: y2
            }), getMatrix = () => {
                const viewPortWidth = ("undefined" != typeof window ? {
                    width: window.innerWidth || document.documentElement.clientWidth,
                    height: window.innerHeight || document.documentElement.clientHeight
                } : vglobal && "getViewportSize" in vglobal && vglobal.getViewportSize ? vglobal.getViewportSize() : rotateDom.getBoundingClientRect()).width, domRect = this._vchart.getContainer().getBoundingClientRect(), x1 = domRect.top, y1 = viewPortWidth - domRect.right, matrix = matrixAllocate.allocate(1, 0, 0, 1, 0, 0);
                matrix.translate(x1, y1);
                const centerX = rotateCenter - x1, centerY = rotateCenter - y1;
                return matrix.translate(centerX, centerY), matrix.rotate(Math.PI / 2), matrix.translate(-centerX, -centerY), 
                this.matrix = matrix, matrix;
            };
            registerGlobalEventTransformer(vglobal, this._vchart.getContainer(), getMatrix, getRect, transformPointForCanvas), 
            registerWindowEventTransformer(this._vchart.getStage().window, this._vchart.getContainer(), getMatrix, getRect, transformPointForCanvas), 
            this.vglobal_mapToCanvasPoint = vglobal.mapToCanvasPoint, vglobal.mapToCanvasPoint = mapToCanvasPointForCanvas;
        }, this.cancelTransform = rotateDom => {
            this.rotateDegree = 0, rotateDom.style.transform = "none", rotateDom.style.transformOrigin = "none";
            const domRect = this._vchart.getContainer().getBoundingClientRect(), x1 = domRect.left, y1 = domRect.top, x2 = domRect.right, y2 = domRect.bottom, getRect = () => ({
                x1: x1,
                y1: y1,
                x2: x2,
                y2: y2
            }), getMatrix = () => {
                const matrix = matrixAllocate.allocate(1, 0, 0, 1, 0, 0);
                return matrix.translate(x1, y1), matrix;
            };
            registerGlobalEventTransformer(vglobal, this._vchart.getContainer(), getMatrix, getRect, transformPointForCanvas), 
            registerWindowEventTransformer(this._vchart.getStage().window, this._vchart.getContainer(), getMatrix, getRect, transformPointForCanvas), 
            vglobal.mapToCanvasPoint = this.vglobal_mapToCanvasPoint;
        };
    }
    onInit(service) {
        const {globalInstance: vchart} = service;
        vchart && (this._vchart = vchart, vchart.rotate90WithTransform = this.rotate90WithTransform, 
        vchart.cancelTransform = this.cancelTransform);
    }
    release() {
        this._vchart = null, this.vglobal_mapToCanvasPoint = null, this.matrix = null, super.release();
    }
}

RotatePlugin.pluginType = "vchart", RotatePlugin.specKey = "rotate", RotatePlugin.type = "rotatePlugin";

export const registerRotatePlugin = () => {
    registerVChartPlugin(RotatePlugin);
};
//# sourceMappingURL=rotate.js.map