0

私はjsPDFライブラリを使用しようとしています。画像を読み込んで挿入し、PDF ファイルをエクスポートしたいと考えています。

私の問題は、画像の読み込みに関するものです。私はこれをやっています：var imageData = getBase64Image('thinking-monkey.jpg');そして、内部のbase64でdataURLを取得する必要がありますimageData。

私のgetBase64Image()機能は次のことを行います：

function getBase64Image(url) {
    var img = new Image();
    var dataURL;

    img.src = url;

    img.onload = function() {
        var canvas = document.createElement('canvas');
        canvas.width = img.width;
        canvas.height = img.height;

        var context = canvas.getContext('2d');
        context.drawImage(img, 0, 0);

        dataURL = canvas.toDataURL('image/jpeg');

    }

    return dataURL;
}

しかし、画像が 65 Kb 程度で、一度に読み込まれないため、「未定義」が返されます。そのreturn dataURL;ため、変数はまだ定義されていません。

setTimeout()前に権利を追加しようとしましたreturn dataURL;が、機能していないようです。

画像が完全にロードされて dataURL が返されるまで待つにはどうすればよいですか?

ありがとう。

4

2 に答える 2

0

「return」ステートメントを img.onload 関数内に移動します。これでうまくいくはずです。

function getBase64Image(url) {
    var img = new Image();
    var dataURL;

    img.src = url;

    img.onload = function() {
        var canvas = document.createElement('canvas');
        canvas.width = img.width;
        canvas.height = img.height;

        var context = canvas.getContext('2d');
        context.drawImage(img, 0, 0);

        dataURL = canvas.toDataURL('image/jpeg');

        return dataURL;   /* MOVED */
    }
}
于 2014-04-27T15:11:03.503 に答える