Форум программистов, компьютерный форум, киберфорум
JavaScript: HTML5 Canvas
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
403 / 19 / 5
Регистрация: 17.01.2017
Сообщений: 572

При повороте объект разворачивается в противоположное направление?

29.03.2024, 01:54. Показов 592. Ответов 0
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Здравствуйте, такая проблема когда перемещаю мышку объект плавно поворачивается за ней и через некоторое время турель разворачивается в противоположное направление. Чтобы понять в чем проблема я сделала два примера.
1.На Flash (Action Script 3.0.) “Хоть он и устарел”.
2.На html5 (Библиотека Easeljs). Ее я выбрала потому, что она максимально приближенна к Action Script 3.0. Здесь есть addChild для добавления объектов.
Когда делала на HTML 5 объект прокручивается пример gif-анимации ниже.

На Flash работает все нормально.

В текстовых полях вывожу переменная _rotateTo, чтобы увидеть содержимое. Почему-то код на HTML5 постепенно увеличивает значение _rotateTo аж до 700 (это можно увидеть на первой гифке в тэге input) хотя поворот должен быть только на 360 градусов. Если взглянуть на flash(вторя gif), то здесь все нормально.
Почему так плохо работает поворот на html5 + Easeljs?
Вот код HTML5:
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
<html><head>
    <title>Turel</title>
    <script src="easeljs-NEXT.js"></script>
 
    
    <script>
        var stage, holder,_weaponManager, bmp,dx,dy;
        function init() {
            stage = new createjs.Stage("demoCanvas");
            stage.enableMouseOver();
            
            
               bmp = new createjs.Bitmap("/assets/WeaponQuadSkin.png");
         
         bmp.x = 225;
         bmp.y = 275;
        
      
         
         bmp.regX = bmp.image.width/2;
         bmp.regY = bmp.image.height/2;
         
         
        
         bmp.rotation = 90;
            
            stage.addChild(bmp);
        
            createjs.Ticker.addEventListener("tick", update);
            
            function update()
            {
            
        updateRotation();
            }
      stage.on("stagemousemove", function(evt) {
       
          
         
      });
         function updateRotation(evt)
         {
        
        dx = bmp.x - bmp.parent.mouseX;
        dy = bmp.y - bmp.parent.mouseY;
        
        _rotateTo = getDegrees(getRadians(this.dx, this.dy));   
        
        
         if ( _rotateTo > bmp.rotation + 180)  _rotateTo -= 360;
         if ( _rotateTo < bmp.rotation - 180)  _rotateTo += 360;
         document.getElementById("debug").value=_rotateTo;
         var _trueRotation = (_rotateTo - bmp.rotation) / 20;
        
       
        bmp.rotation += _trueRotation;
        
         }
         
        function getDistance(delta_x, delta_y)
        {
            return Math.sqrt((delta_x*delta_x)+(delta_y*delta_y));
        }
        
        function getDegrees(radians)
        {
            
            
            return radians / 0.01745;
        }
        
        function getRadians(delta_x, delta_y)
        {
            var r = Math.atan2(delta_y, delta_x);
            
            if (delta_y < 0)
            {
                r += 6.283;
            }
            
            return r;
        }
            
        createjs.Ticker.on("tick", stage);
        }
    </script>
</head>
<body onload="init();">
 
    <canvas id="demoCanvas" width="550" height="440" style="">
        alternate content
    </canvas>
<input type="text" id="debug"/>
</body></html>
Прикрепляю и исходники с библиотекой Easeljs.
turel.zip
Также код на Flash.
ActionScript 3
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
var hr:Hero = new Hero();
addChild(hr);
hr.x = 225;
hr.y = 275;
stage.addEventListener(Event.ENTER_FRAME,onEf);
var dx,dy,_rotateTo;
function onEf(e:Event)
{
    dx = hr.x - stage.mouseX;
    dy = hr.y - stage.mouseY;
     _rotateTo = getDegrees(getRadians(dx, dy));    
     
     if ( _rotateTo > hr.rotation + 180)  _rotateTo -= 360;
     if ( _rotateTo < hr.rotation - 180)  _rotateTo += 360;
     text_txt.text=_rotateTo;
      var _trueRotation = (_rotateTo - hr.rotation) / 20;
      
      hr.rotation += _trueRotation;
    
}
 
function getDistance(delta_x, delta_y)
{
            return Math.sqrt((delta_x*delta_x)+(delta_y*delta_y));
}
        
        function getDegrees(radians)
        {
            return radians / 0.01745;
        }
        
        function getRadians(delta_x, delta_y)
        {
            var r = Math.atan2(delta_y, delta_x);
            
            if (delta_y < 0)
            {
                r += 6.283;
            }
            
            return r;
        }
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
29.03.2024, 01:54
Ответы с готовыми решениями:

Менять направление движения при повороте объекта
Я толкаю объект с помощью rigidbody.AddForce() в одну сторону. И если я его поворачиваю, он дальше продолжает лететь в эту сторону. Как мне...

Стрельба в игре: пуля меняет направление при повороте танка
здравствуйте я пишу игру наподобие Battle City. пока у меня есть только танк который стреляет. Проблема в том что пуля меняет свое...

Дочерний объект(фонарик) деформируется при повороте камеры игрока(родительского объекта этого фонарика)
Я сделал модель фонарика дочерней по отношению к камере,чтобы фонарик вращался вместе с камерой игрока,но при любом вращении фонарик...

0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
29.03.2024, 01:54
Помогаю со студенческими работами здесь

При перетаскивании окна вверх экрана оно разворачивается
Как заставить окно НЕ разворачиваться при перетаскивании его в верх экрана?

При просмотре видео в онлайне не разворачивается на полный экран
Привет ребята . У меня такая проблема при ролсмотре видео в онлайне при разворачивании на полный экран выкидывает белый экран и все флеш...

Не разворачивается окно из трея при запуске второй копии
Добрый день! Нужно сделать, чтоб свернутая или свернутая в трей программа разворачивалась при попытке запуска второй копии. using...

Не разворачивается форма при нажатии кнопки на панели задач
Здравствуйте! Я, конечно, в Delphi только лишь начинающий. У меня возникла проблема следующего плана: при нажатии кнопки на панели задач,...

Ошибка при загрузки изображений с карты памяти при повороте экрана
Здравствуйте! Вопрос в следующем. Загружаю в активити фотки с камеры. Имя файла передаю следующим кодом: Intent captureIntent = new...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
1
Ответ Создать тему
Новые блоги и статьи
PhpStorm 2025.3: WSL Terminal всегда стартует в ~
and_y87 14.12.2025
PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .
Access
VikBal 11.12.2025
Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.
Новый ноутбук
volvo 07.12.2025
Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro
Музыка, написанная Искусственным Интеллектом
volvo 04.12.2025
Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .
От async/await к виртуальным потокам в Python
IndentationError 23.11.2025
Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
Поиск "дружественных имён" СОМ портов
Argus19 22.11.2025
Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .
Сколько Государство потратило денег на меня, обеспечивая инсулином.
Programma_Boinc 20.11.2025
Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .
Ломающие изменения в C#.NStar Alpha
Etyuhibosecyu 20.11.2025
Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .
Мысли в слух
kumehtar 18.11.2025
Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .
Создание Single Page Application на фреймах
krapotkin 16.11.2025
Статья исключительно для начинающих. Подходы оригинальностью не блещут. В век Веб все очень привыкли к дизайну Single-Page-Application . Быстренько разберем подход "на фреймах". Мы делаем одну. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2025, CyberForum.ru