1

srcDOM 属性を使用してイメージ セットを指定することは不可能であるため-webkit-image-set、次のようにイメージ コンテンツを指定するために使用しています。

<img id="imgTest" />
...
#imgTest {
    background-image: -webkit-image-set(url(icon1x.jpg) 1x,url(icon2x.jpg) 2x);
}

デバイスのピクセル比に応じて、画像コンテンツは正常に読み込まれます。ここで、画像をキャンバスにダンプする必要があります。これが私のコードです：

var c = document.createElement("canvas");
var ctx = c.getContext("2d");
c.width = 20;
c.height = 20;
ctx.drawImage(document.getElementById("imgTest"), 0, 0);

// Let's see what we've got in the canvas.
var data = ctx.getImageData(0, 0, 2, 2).data;

この時点で、dataはゼロで埋められた配列です (実際の画像は明らかに空ではありません)。たとえばのsrc属性を設定すると、コンテンツは実際の画像を反映します。#imgTesticon2x.pngdata

a を含む画像のコンテンツを大静脈にダンプできるかどうか、考えはあり-webkit-image-setますか?

4

1 に答える 1

0

私は -webkit-image-set にもあなたのコードにも精通していないので、あなたが提案しているものを再現できませんでした。だから結局、わからない。

ただし、私は HTML と JavaScript に十分精通しており、画像要素がまだロードされていないか、背景と実際の画像に異なるデータ スペースがあり、drawImage() が実際の画像データを使用していると推測します。したがって、src プロパティを使用し、onload ハンドラーを使用して画像を描画するか、本体の読み込みが完了したときに画像を描画することをお勧めします。

もう 1 つのオプションは、src プロパティ セットを使用して非表示の画像要素を作成し、そのデータを読み込み後に使用することです。

于 2013-01-08T02:37:36.800 に答える