Рисование изображения на холсте с дисплеем Retina

Question

Это веб-приложение в телефоне Я использовал изображение 320 на 480, чтобы нарисовать, но он нечеткий.

HTML

<canvas id="canvas" height=480 width=320> 
Your browser does not support the HTML5 canvas tag.</canvas> 

Javascript

var canvas = document.getElementById('canvas'); 
var ctx = canvas.getContext('2d'); 
ctx.drawImage(images[index],0,0,320,480); 

Как четко нарисовать на дисплее сетчатки?

Answer 1

Если у вас есть доступ к более крупным версиям изображений, вы можете удвоить видимое разрешение.

Исходные изображения должны быть 640x960:

Это код «пиксель двойной» разрешение изображения.

canvas.width = 640; 
canvas.height = 960; 
canvas.style.width = "320px"; 
canvas.style.height = "480px"; 

Если нет, то вы можете использовать один и тот же эффект «пиксель удвоения» и представляют меньшую, но более четкую версию, используя существующие изображения:

canvas.width = 320; 
canvas.height = 480; 
canvas.style.width = "160px"; 
canvas.style.height = "240px";