После поворота изображения я не вижу размытия при попытке размыть часть изображения

Question

Я использую HTML5 canvas и «create.js» для создания функции редактирования изображений. Функция редактирования изображения имеет такие функции, как «вращение» и «размытие» изображения.

Проблема теперь в том, что после «поворота» изображения, если вы «размываете» заданную область изображения, размытие нигде не появится. Если вращение не выполняется, указанный диапазон будет размыт обычно.

Размытие изображения является частью фонового изображения, обрезанного с помощью маски, и фильтр размытия установлен на обрезанное изображение.

Как заставить размытие появляться правильно после поворота?

«Create.js» получает последний источник с официального сайта

• Подтверждено, что размытие можно использовать без поворота изображения.
• Было подтверждено, что если изображение размыто, а не изображение, оно будет отображаться правильно даже после поворота изображения.

Ожидаемый результат: Обрезанное и размытое изображение отображается в положении «координата x: 100, координата y: 300».

Фактический результат: Обрезанное и размытое изображение нигде не появляется.

let myCanvas = document.getElementById("myCanvas");
let myStage = new createjs.Stage("myCanvas");
let myContainer = new createjs.Container();
let myBmp = new createjs.Bitmap("image/600×800.png");

window.addEventListener ("load", init);

function init() {
    let img = new Image();
    img.src = "image/600×800.png";
    img.onload = function () {
        myCanvas.width = img.width;
        myCanvas.height = img.height;

        myStage = new createjs.Stage("myCanvas");
        myStage.addChild(myContainer);
        myContainer.addChild(myBmp);


        // Image rotation
        let v = myBmp.getBounds();
        let x = v.width / 2;
        let y = v.height / 2;
        myBmp.regX = x;
        myBmp.regY = y;
        myBmp.rotation += 90;
        myBmp.x = y;
        myBmp.y = x;
        myCanvas.width = v.height;
        myCanvas.height = v.width;


        // Blur range setting
        let maskImage = myBmp.clone();
        let maskShape = new createjs.Shape();
        maskShape.graphics.beginFill("#FFF");
        maskShape.graphics.drawRect(100, 300, 100, 100);
        maskImage.set({ mask: maskShape });

        // Cutting range blur
        blurFilter = new createjs.BlurFilter(15, 15, 1);
        maskImage.filters = [blurFilter];
        maskImage.cache(100, 300, 100, 100);


        // Shape blur
        var shape = new createjs.Shape().set({ x: 100, y: 100 });
        shape.graphics.beginFill("#ff0000").drawCircle(0, 0, 50);
        var blurFilter = new createjs.BlurFilter(5, 5, 1);
        shape.filters = [blurFilter];
        var bounds = blurFilter.getBounds();
        shape.cache(-50 + bounds.x, -50 + bounds.y, 100 + bounds.width, 100 + bounds.height);

        myContainer.addChild(maskImage);
        myContainer.addChild(shape);

        myStage.update();
    };
}