Come eseguire il rendering di contenuto WebGL utilizzando dispositivi DPI ad alta risoluzione?

Question

Qual è il modo giusto per configurare un WebGL per il rendering su tutti i pixel nativi su un display ad alto punto per pollice (come una retina di macbook o un chromebook di pixel)?

Answer 1

per WebGL è relativamente semplice.

var desiredCSSWidth = 400; 
var desiredCSSHeight = 300; 
var devicePixelRatio = window.devicePixelRatio || 1; 

canvas.width = desiredCSSWidth * devicePixelRatio; 
canvas.height = desiredCSSHeight * devicePixelRatio; 

canvas.style.width = desiredCSSWidth + "px"; 
canvas.style.height = desiredCSSHeight + "px"; 

Vedi http://www.khronos.org/webgl/wiki/HandlingHighDPI

Non ci sono test di conformità che queste regole vengano rispettate. In particolare, il browser non è autorizzato a modificare le dimensioni del backingstore per il canvas per un canvas WebGL.

Per la normale tela 2D è meno semplice, ma non era quella la domanda posta.