2014-06-20 21 views
10

Secondo l'articolo di Paul Lewis, High DPI Canvas: È necessario prendere in considerazione lo context.backingStorePixelRatio per risolvere i problemi di sfocatura.Perché context2d.backingStorePixelRatio è deprecato?

Se questa proprietà è stata dichiarata obsoleta, guizzerà per risolvere il problema di sfocatura sul dispositivo ad alta definizione?

+0

Chiunque della squadra di freccette lo sappia? – kzhdev

risposta

22

ho pensato la stessa cosa e per quanto riguarda la Issue Tracker dice:

Sì, quindi l'articolo è stato scritto indietro quando Safari ha avuto un rapporto di supporto negozio di 2. E 'sempre stato 1 in Chrome.

Come dici tu l'approccio per affrontare questo è:

canvas.width = width * window.devicePixelRatio;
canvas.height = height * window.devicePixelRatio;

canvas.style.width = width + 'px';
canvas.style.height = height + 'px';

Dove width e height sono tuttavia si desidera loro (probabilmente window.innerWidth & innerHeight per shenanigans full viewport.)

Poi basta necessario regolare per il fatto che si upscaled la tela con:

ctx.scale(window.devicePixelRatio, window.devicePixelRatio);

Così il gioco è la vostra soluzione.

+0

Questa risposta dovrebbe essere accettata. – RenatoUtsch