我正面临着一个问题，图像覆盖图像与背景图像使用KonvaJs JQuery。我想只在图像上设置分辨率，而不是整个图像的大小。请查看随附的屏幕截图。这将帮助你更容易理解。我需要你帮忙解决这个问题。Resize KonvaJs Image我期待的结果是这样的。Expected KonvaJs Resize ImageOverlay ImageBackground Image画布图像-Canvas Resize Image谢谢
我试过这个代码。

// Create a Konva.js stage
        var stage = new Konva.Stage({
          container: 'canvas-container',
          width: 712,
          height: 575,
        });

        // Create a Konva.js layer
        var layer = new Konva.Layer();
        stage.add(layer);

        // Load the background image (non-resizable)
        var backgroundImg = new Image();
        backgroundImg.src = customBgImagePath;

        backgroundImg.onload = function () {
          var background = new Konva.Image({
            image: backgroundImg,
            width: 712,
            height: 575,
          });

          layer.add(background);

          // Load the overlay image (resizable)
          var overlayImg = new Image();
          overlayImg.src = removedBgImagePath;

          overlayImg.onload = function () {
            var overlay = new Konva.Image({
              image: overlayImg,
              x: stage.width() / 2 - overlayImg.width / 2, // Center horizontally
              y: stage.height() / 2 - overlayImg.height / 2, // Center vertically
              draggable: true, // Enable drag-and-drop
            });

            layer.add(overlay);
            stage.draw();

            // Create a Konva.js Transformer for resizing only the overlay image
            var tr = new Konva.Transformer({
              nodes: [overlay],
              //keepRatio: true,
              //ignoreStroke: true
            });

            tr.hide();
            layer.add(tr);

            // When the image is clicked
            overlay.on('click', function () {
              // Toggle the Transformer's visibility and interactivity
              tr.visible(!tr.visible());
              tr.enabled(tr.visible());
              layer.draw();
            });

            stage.on('click', function (event) {
              // Hide the Transformer if the user clicks anywhere else on the stage
              tr.visible(false);
              tr.enabled(false);
              layer.draw();
            });

            // Enable resizing for the overlay image
            tr.on('transform', function () {
              layer.batchDraw(); // Redraw the layer ,
            });

            /* dataURL = stage.toDataURL({ pixelRatio: 3 });*/
            layer.Draw();

            //// Redraw the canvas on drag, drop, and resize
            //overlay.on('dragmove', function () {
            //  layer.draw();
            //});

            //overlay.on('transform', function () {
            //  layer.draw();
            //});

          };
        };