Найдено результатов: 6

Как растянуть изображение на канве *без* сглаживания (в webkit)

Надо увеличить изображение в 2, 3, 4 и т.д. раз, причём, чтоб сохранялась пикселизация.

Что пробовал:
1) через css увеличить размер канвы. +) быстро -) есть сглаживание
2) mozImageSmoothingEnabled=false; drawImage(...). +) бысто, без сглаживания -) gecko only
3) getImageData/putImageData и увеличение руками. +) без сглаживания -) очевидно, медленней чем нативные методы.

Использую способ №3, в моём случае (раз-loop-ленные циклы, update по регионам) работает мгновенно.
Но!

В последнее время много говорят о смерти флеша и о безоговорочной победе html5. Так вот, во flash можно выключить сглаживание, а как же великий и могучий html5? Неужели в этом гиганте, убивающем флэш наповал, нельзя сделать такой вот примитив (т.е. чтоб кроссбраузерно)?

p.s. в некоторых местах забыл расставить тэги sarcasm.

CSS   JavaScript   Canvas   HTML    

317   2   11:48, 13th August, 2020


Hover-state отдельных областей canvas

Здравствуйте! Возникла проблема реализации hover-state отдельных областей canvas.
Предположим, что на холсте 40х80 два квадрата по 40 пикселов. Понять, какую именно область подсвечивать (при назначении обработчика mousemove) проблем не представляет, проблема в том, чтобы изменять (например, затемнять) область надо лишь 1 раз, и когда указатель покинул нужное пространство возвратить исходный вид области. Прошу прощения, если вопрос глуп — я только осваиваю canvas. Заранее спасибо за советы.

JavaScript   Canvas   HTML    

341   1   15:32, 10th August, 2020


Кубическая панорама на Canvas

Может кто подскажет, есть ли простое готовое freeware решение для показа кубических панорам в браузере, сделанное на Canvas? На Flash, знаю, есть замечательная «freeDexPano» pano.3dex.ru/.

Canvas   Freeware    

359   2   00:51, 20th August, 2020


HTML5 анимация в canvas на JavaScript

Каким образом реализовывать анимацию на canvas в HTML5?

Просто задать интервал времени, через который каждый раз будет вызываться функция, которая в свою очередь будет заново прорисовывать содержимое canvas, или есть лучший способ?

JavaScript   Canvas   HTML   Анимация    

412   1   02:52, 12th August, 2020


Как использовать rotate в canvas HTML5?

Как правильно применять JS метод rotate для элемента canvas в HTML5?


Если я просто делаю context.rotate(0.05) то изображение начинает съезжать по какойто странной траектории.


Задача простая: повернуть вокруг своей оси на 60 градусов объект canvas.


Приведите пример.


UPD: Что в этом коде не так?


function html5(){

// экспериминирую с canvas HTML5

ctx.beginPath()

ctx.arc(110, 113, 105, 0, Math.PI);

ctx.lineWidth = 10;

ctx.strokeStyle = '#000';

ctx.rotate(2); // < — переаворачиваем, тут явно нужно что-то еще добавить…

ctx.stroke();

ctx.closePath();

}

Canvas   HTML    

424   5   04:29, 13th August, 2020


Линии переменной толщины в HTML5 Canvas

Существует ли JS-библиотека, умеющая рисовать по canvas-у линии переменной толщины?

Ну то есть например: в начале толщина 3px, в конце 5px, и чтобы она плавно менялась вдоль всей линии.

Для прямых это, в принципе, реализовать не очень сложно. А вот для кривых Безье решение нетривиально.

JavaScript   Canvas    

390   2   21:06, 1st October, 2020