@fatih255 - Cevaplar | 𝗣𝗥𝗢𝗧𝗢𝗧𝗨𝗥𝗞


        const myimage = new Image();
        myimage.src = image;


        console.log(myimage.naturalWidth, myimage.naturalHeight, crop.width, crop.height)
        const canvas = document.createElement('canvas');
        const scaleX = myimage.naturalWidth / onImageLoaded.crop.width;
        const scaleY = myimage.naturalHeight / onImageLoaded.crop.height;
        canvas.width = crop.width;
        canvas.height = crop.height;
        const ctx = canvas.getContext('2d');



        ctx.drawImage(
            myimage,
            crop.x * scaleX,
            crop.y * scaleY,
            crop.width * scaleX,
            crop.height * scaleY,
            0,
            0,
            crop.width,
            crop.height,
        );




        // As Base64 string
        return canvas.toDataURL('image/jpeg');

        // As a blob
        /* 
         return new Promise((resolve, reject) => {
             canvas.toBlob(blob => {
                 blob.name = fileName;
                 resolve(blob);
             }, 'image/jpeg', 1);
         });*/

çözümü bu şekilde takılan arkadaşlara destek olsun cok ugrastırdı. Burada öğrendiğim şey canvasa bir resim cizmek istediğimizde HTML ımage olarak yenı bır element olusturmak sonrasında da tabi farklı sorunlarlada karşılastım mesela cropladıgım alanın degerleri tam optimize olmuyordu suan sorunsuz calısıyor teşekkürler kardeşim herkese iyi çalışmalar