Как предотвратить масштабирование изображения @2x в javascript на iPad с сетчаткой?

Я разрабатываю веб-игру, используя html <canvas>и javascript. Игра также должна работать на iPad, предпочтительно как на дисплеях Retina, так и без -Retina. В этой игре я использую спрайт-лист png. Этот спрайт-лист имеет ширину 3500 пикселей и высоту 3700 пикселей.

В логике моей игры я использую холст context.drawImage(), чтобы захватить спрайты и нарисовать их на моем холсте. В настольном браузере это прекрасно работает, и все отлично. На сетчатке iPad изображение загружается только на четверть своего размера, из-за чего многие из моих вызовов drawImage()терпят неудачу, думая, что они пытаются захватить пиксели за пределами загруженного изображения. (Если я беру спрайт в позиции 1200, 1400, а iPad считает, что мое изображение меньше этого, возникает ошибка INDEX _SIZE _ERR.)

Например, код, написанный ниже, — это то, что у меня есть в моем проекте. При оповещении о ширине и высоте я получаю результат 875 пикселей в ширину и 925 пикселей в высоту -, что составляет ровно 1/4 размера исходного изображения.

spritesheet = new Image();
spritesheet.onload = function() {
    splashInterval = setInterval(renderFrame, 30);
    alert(spritesheet.width); // returns 875 on retina iPad
    alert(spritesheet.height); // returns 925 on retina iPad
};
spritesheet.src = "/spritesheet.png";

Обычное решение этой проблемы для дисплеев Retina состоит в том, чтобы создать изображение увеличенного размера, поэтому, когда iPad уменьшает его масштаб, все в порядке. Однако, исходя из размеров, указанных выше, мне пришлось бы создать изображение, которое в 4 раза больше по ширине и высоте. Получается изображение размером 14 000 пикселей в ширину и 14 800 пикселей в высоту. Даже в виде сплошного белого jpg это изображение не может быть сохранено в Photoshop, и в Gimp сообщается, что его размер составляет 1,9 ГБ. Естественно это не решение. ;)

Поэтому мой вопрос остается в силе :Есть ли способ предотвратить уменьшение масштаба изображений, загружаемых через Javascript, на дисплее сетчатки iPad? Когда я загружаю свое изображение размером 3500x3700 пикселей,Мне нужно, чтобы он оставался на уровне 3500x3700 пикселей, чтобы мои вызовы context.drawImage()работали как положено.

Любые и все идеи будут оценены. Спасибо!

7
задан A. Degré 19 July 2012 в 16:24
поделиться