1インチあたりのユーザーのピクセル数を検出する方法を誰かが考えられますか?画像が必要なサイズでWebブラウザーに表示されるようにしたいので、解像度(ユーザーエージェントから取得できます)と1インチあたりのピクセル数の組み合わせを使用してこれを行うことができます。
ただし、理想的にはJavaScriptまたはその他の非侵襲的な方法を使用して、ユーザーの1インチあたりのピクセル数を検出する方法があるかどうかはわかりません。
助言がありますか?
ありがとう、
CJ
次のjavascript関数を使用してDPIを取得できます。
<script type="text/javascript">
var dpi = {
v: 0,
get: function (noCache) {
if (noCache || dpi.v == 0) {
e = document.body.appendChild(document.createElement('DIV'));
e.style.width = '1in';
e.style.padding = '0';
dpi.v = e.offsetWidth;
e.parentNode.removeChild(e);
}
return dpi.v;
}
}
alert(dpi.get(true)); // recalculate
alert(dpi.get(false)); // use cached value
</script>
96
ただし、 Windowsマシンでは常に返されると思います。
私の知る限り、オペレーティングシステムがビューポートの実際の物理的寸法を決定する方法はありません。したがって、ソフトウェアが実際のDPIを知ることは実際には不可能である可能性があります。
ただし、専門家は、画面上のDPIが実際のDPIと一致することを確認する特定のブランチです。そのような場合、上記のjavascriptでおそらく十分でしょう。
注:
上記のコードは、WinXPおよびWin2kのOpera 9、IE6および7、Firefox3.6でテストされています。
更新:
noCacheパラメーターを追加しました。しかし、私はそれが何らかの効果をもたらすとは思えません。上記のWindowsバージョンでFireFoxとOperaをズームインしてテストしたところ、ズームの量に関係なく、DPIは「96」と引用され続けています。モバイルデバイスがこれをどのように利用しているかを見るのは興味深いでしょう。
昔の描画パッケージと同じように、伸縮性のある定規を表示することができます。画面に配置した物理的な定規と一致するまで、ユーザーに仮想定規をドラッグしてもらいます。
本番環境での使用に関する深刻な提案ではありませんが、おそらく実際に正しい答えを得る唯一の方法です:(。
最も安全で簡単なのは、画像のサイズをブラウザに指示することです。CSSはインチとメトリックをサポートしているため、次の例のように画像を指定できます。
<img src="image.png" style="width:15cm;height:10cm;" alt="Centimeters" />
<img src="image.png" style="width:5.9in;height:3.9in;" alt="Inches" />
<img src="image.png" style="width:150mm;height:100mm;" alt="Millimeters" />
今日のディスプレイは96px/inchまたは72pixels/inchをサポートしています。
HTTPリクエストのUser-Agentヘッダーを取得できます
User-Agent: Mozilla/5.0 (Linux; X11)
これはあなたにオペレーティングシステムを教えてくれます、そしてここからあなたは決定をすることができます。
これは非常に難しい場合があります-レンダリングされた画像をdpiに基づいてスケーリングすることに成功したとしても、ユーザーがブラウザで画像を直接スケーリングできないようにするにはどうすればよいですか?
フラッシュやSilverlightなどの豊富なインターフェイステクノロジーを検討しましたか?彼らはあなたに追加のオプションを与えるかもしれません。