Comments 47
Здорово! Очень интересно!
+3
круто, только примеры не работают :)
0
Они не грузятся или не работают? :) Я проверял в IE9 RC, Chrome 10.0.648.82 beta, Firefox 4b11 и Opera 11.01 на Win7. Какой у вас браузер?
0
HTTP Error 503. The service is unavailable.
0
Забавно, что практически все проверки вы производили на бетаверсиях браузеров, которые по определению нестабильны и которымы пользуется пока минимальное кол-во людей :)
Попробовал на последнем стабильном Firefox — работает :)
Попробовал на последнем стабильном Firefox — работает :)
0
Чуть-чуть подправить цвета…
0
Здорово, но чтобы подарок был оформленным, девушке надо дарить такую открытку, как фон рабочего стола на новеньком, только что купленном ей ноутбуке.
+6
Поздравительная открытка к 8 марта на HTML5 и EaselJS и блог компании Microsoft. Казалось бы, какая связь?
+5
Вы против? :)
0
Создатели EaselJS сотрудничают с MS, а в топике типа пиар)
+4
Честно, у меня не было цели рекламировать именно EaselJS, но если бы и было — оно того стоит ;) Реально облегчает жизнь во многих сценариях.
0
Свое всегда кажется лучше и удобнее :) И согласен, есть еще куда двигаться, библиотека еще только развивается. Впрочем, на ее ранеей версии сделано www.pirateslovedaisies.com/ — думаю, это достаточный показать потенциала.
0
Я знаю про пиратов — вполне неплохо. Но пиратов можно было бы сделать и без фреймворка.
Я стараюсь судить объективно. Например, JQuery и MooTools круче, чем мой atomJS, с чем я даже не собираюсь спорить.
Но смотрите — кучу рутинных операций вам всё равно приходится пределывать вручную.
Прелоадинг картинок, анимацию, та даже получение случайной точки на холсте.
Да и идею с методом «tick» в глобальной области видимости, а также
Обе штуки можно было бы исправить нормальной событийной моделью, как, например, сделано в JQuery:
На первый взгляд, конечно, разницы нету, но что будет, если надо будет прилепить два события? В dhtml раньше тоже так делали, но ведь отказались от этого со временем?
В общем, много вещей — непродуманно, а много — вообще не сделано. Ну да ладно, кому то оно нравится и это главное)
Я стараюсь судить объективно. Например, JQuery и MooTools круче, чем мой atomJS, с чем я даже не собираюсь спорить.
Но смотрите — кучу рутинных операций вам всё равно приходится пределывать вручную.
Прелоадинг картинок, анимацию, та даже получение случайной точки на холсте.
Да и идею с методом «tick» в глобальной области видимости, а также
this.onMouseOver
. Обе штуки можно было бы исправить нормальной событийной моделью, как, например, сделано в JQuery:
this.onMouseOver = function (e) { this.reset(); };
// =>
this.bind('mouseover', function () {
this.reset();
});
// а также
stage.bind('update' , function () {});
На первый взгляд, конечно, разницы нету, но что будет, если надо будет прилепить два события? В dhtml раньше тоже так делали, но ведь отказались от этого со временем?
В общем, много вещей — непродуманно, а много — вообще не сделано. Ну да ладно, кому то оно нравится и это главное)
0
Кстати, оно основано на фреймворке YUI?
+2
Спрашиваю вот почему — во всех заголовках мануала — есть упоминание, а в тексте — не нашёл:
+1
EaselJS? Отсылок на YUI не видел. Насколько я знаю, авторы отталкивались от задачи воспроизвести на canvas и javascript привычные для них возможности flash и соответствующих классов на actionscript.
0
у меня все бабочки улетели и не хотят возвращаться! (ф5 помог)
0
В Chromium 11.0.691.0 (76865), Ubuntu 10.10 бабочки начитают лететь, только если навести на них курсор.
0
«на фоне красовой»
Прошу прощения, так и должно быть?
Прошу прощения, так и должно быть?
0
«Машем», а не «махаем»!
+1
Я сначала всех бабочек прогнала, а потом накликала целую кучу что они бедняжки даже летали тяжело!
Спасибо за поздравление! ^_^
Спасибо за поздравление! ^_^
+1
Я, конечно, очень сильно извиняюсь, но совершенно унылые бабочки. Вы же видели как летают бабочки (живые). С такой частотой взмахов крыльями как у Вас, простите, но «не взлетит».
По задору больше напоминает осенних мух, нежели бабочек.
По задору больше напоминает осенних мух, нежели бабочек.
0
Если делать быстрее, то ничего не видно будет :) Воспроизвести реалистично движение крыльев бабочки — отдельная сложная задача. В частности, крылья не являются двумя жесткими плоскостями — это динамичные поверхности, которые синхронно движутся, создавая вокруг необходимые вихревые потоки. Буду рад посмотреть, если воспроизведете.
+5
Ну это ведь казуалка. Не стоит требовать от неё симуляции.
0
Боже мой, такой огромный код ради такой убогой анимации…
Мы тоже на днях делали анимацию бабочки. Решили попробовать интеграцию Flash+JS.
Получилось вот так. (нужно навести мышку на логотип).
Мы тоже на днях делали анимацию бабочки. Решили попробовать интеграцию Flash+JS.
Получилось вот так. (нужно навести мышку на логотип).
-1
Жалко, надпись в фоновом изображении. Так просто не поменяешь
0
Кто-нибудь может объяснить доступно, как берутся формулы для взмахов крыльев и откуда взяты константы в них? Как это было расчитано?
0
butterfly.move = function () {
var wingAngle = (butterfly.steps - butterfly.step) / butterfly.steps * Math.PI;
butterfly.lWing.scaleX = butterfly.rWing.scaleX
= butterfly.scale * (0.4 + 0.6 * Math.abs(Math.cos(wingAngle * 4)));
butterfly.step--;
}
1. Взмахи крыльев делаются через изменение масштаба по оси X.
2. Т.к. бабочки разного размера, в качестве отправной точки масштаба используется мастштаб бабочки butterfly.scale в качестве множителя. (Если размер не менялся, то butterfly.scale = 1).
3. Дальше масштаб нужно менять периодически — здесь хорошо подходят тригонометрические функции.
4. Полет бабочки состоит из {butterfly.steps} шагов, текущий шаг — {butterfly.step}. Из этих двух чисел получается пропорция в отрезке [0, 1.0].
5. Для косинуса (беру cos из соображения удобства) нужно передать угол, пропорцию выше, нужно перевести в интервал [0, PI], значия cos будет, соответственно, 1->… -> 0 ->… -> -1. Так как отрицательные значения нам не нужны, берем модуль (abs).
6. Дополнительный множитель 4 — определяет число взмахов за полет.
7. Коэффициенты 0.4 и 0.6 в сумме должны давать 1 (полный масштаб), 0.4 — сколько нужно оставить, чтобы крылья не схлопнулись.
Как-то так :)
+1
Все понятно, кроме числа взмахов за полет. Почему оно умножается на угол?
0
Sign up to leave a comment.
Делаем поздравительную открытку к 8 марта на HTML5 и EaselJS