0

キャンバスにこの画像を描画するときにfill（）を使用しています。以下のコードを使用して画像をロードします。

var cerceve = new Image();
if ($(".cerceve.accessory-selected").length) {
    cerceve.onload = function () {
        cerceveDeferred.resolve();
    };
    cerceve.src = $(".cerceve.accessory-selected:first img").attr("src");

基本的にsrc、Imageオブジェクトのを定義し、ロードされたら画面に描画し始めます。しかし、画像をカスタムサイズでロードしたいのですが、どうすればよいですか？drawImage()メソッドを使用する必要がありfill()、サイズ変更オプションが指定されていないため、サイズ変更を使用できません。

たとえば、ロードcerceve.height = 40;後に設定cerceveすると、高さ40（40は元の高さよりも大きい）で画像が描画されますが、ソース画像は引き伸ばされず、代わりに繰り返され、同じ画像の多くが描画されます。カスタムの高さを指定すると、画像は繰り返しオプションで動作します。伸ばして欲しいです。

4

1 に答える 1

0

はい、分かりました。ロード後にソース画像のサイズを変更するのではなく、キャンバスに画像を描画するときにコンテキストスケーリングを使用する必要があります。context.scale(x,y);おそらく行く方法です。

于 2012-08-03T01:05:07.670 に答える