function getTransformHandleFun(ele) {
    if (!(ele instanceof HTMLElement || ele instanceof Node)) throw new Error("Note element or node");
    const clamp = (value, min, max) => {
        if (typeof min === "number" && typeof max === "number") {
            return Math.min(Math.max(value, min), max);
        } else if (typeof min === "number" && typeof max !== "number") {
            return Math.max(value, min)
        } else if (typeof min !== "number" && typeof max === "number") {
            return Math.min(value, max)
        }
        return value
    }

    const setTranslate = (options) => {
        if (typeof options === "function") options = options();
        const { isDeff = true } = options;
        const o = { value: 0 }, _ = isDeff ? o : { value: 1 };
        const { dA = _, dB = o, dC = o, dD = _, dTx = o, dTy = o } = options;
        console.log(dA, dB);

        const style = getComputedStyle(ele);
        let transform = style.transform || style.webkitTransform || style.mozTransform;
        if (transform === 'none') transform = "matrix(1, 0, 0, 1, 0, 0)";

        if (transform) {
            const matrixValues = transform.match(/^matrix.*\((.+)\)$/);
            if (!matrixValues) return "matrix(1, 0, 0, 1, 0, 0)";
            const vals = matrixValues[1].split(', ').map(Number);
            const arr = [dA, dB, dC, dD, dTx, dTy];
            while (vals.length < 6) vals.push(0);
            let getVal = isDeff ? (i) => +arr[i].value + vals[i] : (i) => +arr[i].value;
            for (let i = 0; i < vals.length; i++) {
                vals.splice(i, 1, clamp(getVal(i), arr[i].min, arr[i].max))
            }
            transform = `matrix(${vals})`;
        }

        return transform;
    }

    return (options) => {
        ele.style.transform = setTranslate(options);
        return ele;
    }
};