ищет хороший Java/GWT/JS библиотека для создания «вращающейся бутылки» анимация

Question

Я ищу хороший Java/библиотека GWT/Smart GWT или Ext GWT/Javascript, что делает следующее в сети APPLICATION-

(1) Возьмите изображение бутылки и поверните его.

(2) я должен быть в состоянии определить угол поворота, время, необходимое для завершения, что вращение

(3) я должен быть в состоянии легко изменить изображение бутылки, для например, для конкретного спонсора.

В идеале я хочу, чтобы библиотека поддерживала все браузеры, включая IE 6/7/8, однако, если ваша библиотека поддерживает только более новые версии IE, даже тогда любезно упомяните эту библиотеку как возможное решение проблемы.

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

Answer 1

Для старых браузеров вы правы, CSS3 и наиболее подходящая вспышка - вы только надеетесь достичь этого. Тем не менее, для более новых браузеров SVG можно использовать, что дает много преимуществ по сравнению со вспышкой. Вы должны посмотреть в lib-gwt-svg как самостоятельную библиотеку для манипуляции SVG через GWT, которая также может использоваться в SmartGWT. Другая возможность - проверить примеры из SmartGWT. Я не использовал их сам и не могу определить, могут ли они предоставить полное решение вашей проблемы, но они, похоже, находятся рядом с тем, что вы хотите, и, возможно, с некоторой настройкой вы можете получить то, что хотите. Если я хорошо помню, они тоже основаны на SVG.

Answer 2

@ Арвинд, я согласен с ответом гпапаза. Кроме того, я отправляю ссылку на пример с помощью SmartGWT, который может выполнять все ваши 3 требования. example.

Answer 3

Решения, предоставляемые gpapaz и RAS, неплохие, но оба имеют дело с графикой с использованием SVG-, которая не поддерживается старыми браузерами (IE6 приходит на ум).

Я нашел библиотеку для GWT под названием Gwt-graphics, которая рисует/анимирует с использованием SVG для новых браузеров и поддерживает Internet Explorer 6 и новее (6,7 и 8 использует визуализацию VML, 9 использует SVG), а также Firefox, Chrome, Opera и Safari.

Answer 4

raphaeljs и его коллега gwt raphael4gwt поддерживают это легко.

в raphaeljs (и очень похожи по raphael4gwt):

var paper = Raphael("#paper1", 700,700); 
var bottle1 = ppaer.image("bottle1.png", 100,100, 50,200); 
bottle1.transfor("r22"); //rotate 22 degrees