несоответствие координат createJS холсту

Question

У меня есть холст шириной 1280 пикселей и высотой 800 пикселей. Когда я создаю текстовый объект и устанавливаю координаты x: 100 и y: 100; он показывает текст, как показано на рисунке. на этой фотографии.

Разве значения x и y не имеют пиксельные единицы? Если нет, то как я могу изменить его на пиксель?

Answer 1

HTML-элемент canvas имеет собственную ширину и высоту:

<canvas id="canvas" width="300" height="300">

Что вы также можете изменить в JavaScript:

var can = document.getElementById('canvas');
can.width = 500; // the default is 300
can.height = 500; // the default is 150

Это отдельно от ширины CSS и высоты холста. Эта строка устанавливает их обоих:

<canvas id="canvas" width="300" height="300" style="width:300px; height:500px"></canvas>

Попробуйте установить оба параметра и посмотрите, получите ли вы то, что хотите. Возможно, вы установили только CSS, но не установили canvas.width и height, которые по-прежнему являются небольшими значениями по умолчанию 300 и 150!

На дисплеях высокой плотности многие приложения устанавливают для canvas.width и height какое-то значение (скажем, 100) и число CSS вдвое меньше (50). Они делают это, чтобы сделать холст более плотным. Если это звучит так, как вам нужно, вы можете прочитать о «плотности пикселей холста».