Javascript-форум (https://javascript.ru/forum/)
-   Ваши сайты и скрипты (https://javascript.ru/forum/project/)
-   -   canvas rotate center (https://javascript.ru/forum/project/11949-canvas-rotate-center.html)

B~Vladi 22.03.2012 10:42

Gozar, стоит начать отучаться от использования arguments.callee :)

Виктор Кон 22.03.2012 11:23

Вот тут

http://vikohn.narod.ru/test/exam02b.htm

код, где смещение делается автоматически типа

c.drawImage(img,-img.width/2,-img.height/2);

и вроде работает. Правда вращать не пробовал.

Gozar 22.03.2012 11:24

Откройте глаза этим скриптам 2 года. Не занимайтесь некропостингом, либо выложите свой пример.

Виктор Кон 22.03.2012 11:38

Может каким-то скриптам и 2 года, не знаю, я их не видел. А пример я выложил в интернет, этого вполне достаточно. Зачем переписывать?

Gozar 22.03.2012 11:52

Виктор Кон, я не к вам обращался. Вы можете ничего не делать. Ваш пример не имеет никакого отношения к теме, как и все комментарии в ней.

Цитата:

Сообщение от Виктор Кон (Сообщение 164413)
Может каким-то скриптам и 2 года, не знаю, я их не видел.

Невнимательность не делает вам чести. Если вы не видели первый пост, то зачем пишете комментарии в теме?

dmitriymar 22.03.2012 12:15

Кстати кто нибудь делал тесты на производительность между поворотом канвы и матрицей трансформации?
Без теста,возможно субъективное мнение:
при повороте -просто "поворот системы координат" происходит(пересчёт массива точек изображения)
при трансформации -сохранение,трансформация(п ересчёт массива точек изображения),восстановлени е
итого 3 операции вместо одной

vadim5june 23.05.2012 12:10

Цитата:

Сообщение от Gozar (Сообщение 71648)
Сразу вопрос, т.к. это первый мой код связанный с canvas, нет ли решения по проще, например указания точки смещения центра?
Если нет то просьба тыкать во все узкие места скрипта. Ну а остальным просто дарю :)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD 
HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"
>
<html>
<head></head>
<body>
<canvas id="ci" width="280" height="280"></canvas>
<script>
function CanvasCenter(){
var i = new Image();
i.onload = function(){
 var dl = i.width;
var cnv=document.getElementById("ci"); 
var c = cnv.getContext("2d");
   c.drawImage(i, 0, 0, dl, dl);
       var beta = -3;           
var beta = (beta*Math.PI)/360;
var bet=0;      
var x=100;
var y=100;                           
setTimeout(function(){
  bet+=beta; 
c.clearRect(0,0,cnv.width,cnv.height);
c.save();
c.translate(x,y);
c.rotate(bet);
c.drawImage(i, -dl/2, -dl/2);
c.restore();
setTimeout(arguments.callee,10);
                 },0);
}
i.src = "http://javascript.ru/forum/image.php?u=11&dateline=1273676600";
};
CanvasCenter();
</script>
</body></html>
Вот мой вариант-смешение можно задавать
rotate постоянно пользуюсь
а для того чтобы записать и вернуть текущий контест служат функции save() и restore()-

Gozar 10.06.2012 10:46

И всем кто не в теме test123456789test, это клон Awillum-а(cms он усиленно пиарил). Только его забанили за мат и неуважительное отношение к товарищам.

Awilum 27.09.2012 00:28

Цитата:

это первый мой код связанный с canvas
Мой первый код связанный с canvas - это полноценный играбильный арканоид с левелами.

А что у тебя ? О_о

Awilum 27.09.2012 00:34

Автор какое следующие твое творение ? Смотрю на твой профиль и топики http://javascript.ru/forum/search.php?searchid=1206089 и вижу что ты мастер флудерастии. А что нибудь выучить за такое время до сих пор не осилил ? Все также сидишь нищерброд в общаге на бутербродах ? )))


Часовой пояс GMT +3, время: 15:05.