JavaScript библиотека «Raphaël» — SVG расцветает, SVG и iPhone

[soider]

Мм, а причем айфон?

[arestov]

habrahabr.ru/blogs/svg/21300/

[arestov]

и вам спасибо за ссылку. но мне кроме всего ещё очень хотелось поделиться тем, что это работает в iPhone

[arestov]

топик както уныло оформили, наверно поэтому пропустил)

[Fade]

спасибо. штука потрясающая. вручную ковыряться с SVG лениво, а так — очень удобно + по примерам видно, что хорошо работает с jQuery. Надо попробовать векторные карты рисовать…

[xgraph]

Пробовал, получается, но не так шустро работает, как хотелось бы. Поэтому пока растровые карты искоренить никак не выходит…

[Fade]

Скорость не сильно важна. Главное, чтобы большой нагрузки на проц/браузер не было. Меня привлекает размер SVG-файла (и то, что карта, п идее, загружается сразу) и возможности его обработки: можно практически все делать в любом векторном редакторе. По сути SVG позволяет использовать многие возможности Flash без оного.

[deerua]

часики зачет!
нужно подкинуть ТокиоФлеш идейку :)

[arestov]

а что это такое?

[bolk]

О, я вам завидую (без иронии!), откроете для себя TokioFlash: www.tokyoflash.com/en/

[enartemy]

А нафга www.tokyoflash.com/en/ если там www.tokyoflash.com/ru/ есть? :-)))

[asdatarius]

(без иронии) а кому-то реально удобно пользоваться часами от этой конторы? просто я с первого взгляда не понял как работает пара экспонатов (со стороны экспонатов — да, интересные игрушки. но замены обычным часам? хз)

[deerua]

Это то, что сейчас у меня на руке :))
www.tokyoflash.com/ru/watches/tokyoflash/infection/

[Palant]

Такие же часики, только чуть интересней для скринсейвера: blog.pixelbreaker.com/polarclock/

[arestov]

хмм… думаю такую же плавность можно сделать и на svg с помощью SMIL…

[rossomachin]

Стоит добавить, что разработчик «Рафаэля» тоже хабрачеловек: Дима Барановский.

[arestov]

ой! мне показалось, что он как Сергей Брин — вроде русский, а вроде и нет))

[pepelsbey]

Он гораздо более русский, чем тов. Брин :) т. е. не зазнался ещё

[DmitryBaranovskiy]

О, тут оказывается про меня пишут. Опоздал.
Спасибо Максим за PR. :)

[arestov]

так что теперь я ему фидбэки на русском писать буду))

[TedBeer]

Беда всех таких библиотечек — нестандартаный интерфейс. Сколько % возможностей SVG/VML оно охватывает? 5%-10%? Оно хорошо только как разминка для ума в процессе изучения векторной графики в браузерах, ну и для домашней странички пойдет. А на широком уровне оно никогда не будет востребовано, потому что это — очередной доморощенный велосипед.
Что мешает вам, как веб-разработчикам, пользоваться напрямую SVG? Отсутвие поддержки в IE? Ну так тогда самый рациональный и профессиональный подход, вместо написания подпорок в виде таких библиотечек, будет реализвать его! Сделать конвертор SVG в VML.

[arestov]

я надеюсь, что библеотека разовьётся дальше 5%, кроме того спецификация SVG не самая маленькая и на её изучение нужно много времени. Это больше, чем HTML.

Мне ничего не мешает, я просто поделился замечательной биллеотекой и лишний раз провёл пропоганду использования SVG :)

[DmitryBaranovskiy]

Развивайте свою мысль. Вы наверное в курсе, что VML охватывает 50—60% от SVG. Как вы отконвертите анимацию? А clipping? А masking? A внедрённые шрифты? Есть ещё ряд тонкостей, но я уверен, что вы и так о них знаете и с нетерпением жду вашего конвертора VML→SVG.

[TedBeer]

уже есть и с анимацией, но это внутренняя разработка компании

[arestov]

прям таки SMIL с его SVG расширениями конвертируете в JS код для VML?

[TedBeer]

нет, реализован SMIL, который работает на любом DOMе (в том числе на DOM нашего XML based фреймворка и на SVG DOM, включая браузеры где есть SVG, но без анимации), для IE соотвественно создается SVG DOM и код конвертируется в VML. Таким образом имея нормальный DOM можно использовать любые наработки, работающие на стандартном DOM API

[arestov]

Круто!
примерно так? leunen.d.free.fr/fakesmile/

[TedBeer]

да, и у нас оба API — js и декларативный. вот пример кода из наших тестов:
JS:
var elm = this.viewNode;
var oAnimation = {
'attributeName' : 'height',
'dur' : '400ms',
'to' : '1px',
'fill' :'freeze'
};
var fnAnimationCallback = function() {
elm.style.display = 'none';
};
bb.smil.animate(elm, oAnimation, fnAnimationCallback);

или декларативный:
<smil:animate attributeName="value" attributeType="XML" dur="1.0s" from="0" to="255" targetElement="red_slider" fill="freeze" />

тут можно глянуть демки фреймворка, но SVG там пока нету:
demo.backbase.com/explorer/#|examples/smilColorAnimation.xml

[arestov]

класссс! вы, ребята, — молодцы!

[TedBeer]

ага, спасибо! думаю не зря монстры типа Филипса, GM, SAP выбрали наш фреймворк
конечно есть проблемы, не все так радужно как могло бы быть
и фреймворк тяжеловат для простых проектов и уровень входа высок, но мы работаем над улучшением :-)
главное что мы стараемся придерживаться стандартов, а не изобретать свой велосипед(JQuery и иже с ним) и если вы знаете DOM, DOM Events, XML, JS и пр. то можно без проблем начать работать с фреймворком, благо он стал бесплатным.

[arestov]

а почему вы о себе никак не заявляете? я не заметил? считаете что пока рано?

[TedBeer]

Я уже упомянул несколько наших клиентов, так что сказать, что мы «о себе никак не заявляем» было бы неверно :-) Все уже было заявлено несколько лет назад, и фреймворк широко известен в узких кругах :-) Но фреймворк был коммерческим и стоял немеряно, поэтому на специальных ресурсах типа ajax.com принципиально никакие публикации не брались и по сию пору игнорируется. Несмотря на типа «открытость» таких веб-ресурсов война с конкурентами имеет место быть.
Так что сейчас мы по большей части работаем адресно. Прямые контакты с компаниями, демонстрация возможностей, сравнение с конкурентными продуктами. Когда компания с миллионами хитов в день на сайте потратила год на выбор фреймворка, пытаясь реализовать свои идеи и не смогла решить всех проблем, а ей делается демо проект покрывающий 80-90% требуемой функциональсти за 3 дня, то угадай в чью пользу будет окончательный выбор?

[arestov]

хм. всё равно надо поправлять ситуацию))

[TedBeer]

ну это не ко мне, а к нашему менеджменту :-)
если есть желание устроиться к нам вот список вакансий:
www.backbase.com/company/careers/
советую писать в Professional Services — больше шансов, что заинтересуются.
R&D сейчас в процессе структурных изменений, так что вакансии пока не рассматриваются, только если вы сможете заинтересовать своим прошлым опытом :-)

[arestov]

я о том, что надо написать что-нибудь хорошее, «блоггинг» так сказать… хотя бы на хабре :)

[TedBeer]

так как все разработки тесно связаны с фреймворком, то большинству они будут не интересны, а дома есть другие интересы кроме веб-программирования :-)
хотя загадывать не буду, может однажды и родится что-нибудь полезное и оторванное от текущей работы

[DmitryBaranovskiy]

Было бы очень интересно взглянуть.

[TedBeer]

кстати реализация SVG в бразуерах также далека от полного фарша

[DmitryBaranovskiy]

Ой, и не говорите. :)

[apelsyn]

Под Opera mini тоже работает.
Ps. Рафаелем, лет 10 назад, назывался файл-лист генератор для BBS.

[arestov]

а не могли бы вы фотки выложить, как это выглядит на мобиле? (у меня телефон сломался — сам посмотреть не могу)
видел в презентации, что svg будет на operamini и opera mobile, но не думал, что уже есть…

[apelsyn]

Остальные скриншоты смотри здесь.

Первый скрипт не работает в динамике (только первая картинка не рефрешит часы).

[arestov]

эхх! крутота!)

спасибо :)

[Terentich]

Спасибо за демки. Потрясающе смотрится, очень красиво и быстро.

[arestov]

вот будет нормальная поддержка smil во всех браузерах, то можно будет ещё больше увеличить производительность… :)

[Arseniy]

Интересные примеры (часы — особенно). Радует, что svg развивается, очень хотелось бы увидеть его «стандартом» в вебе и возможно, в интерфейсах, и желательно, побыстрей. =)

Кстати, примеры работают (частично) на Safari, с некоторыми ошибками, но работают.

[enartemy]

Вот смотрел я на эти часы, смотрел, думал — где я видел что-то подобное?
Потом вспомнил — в блоге TurboMilk (http://turbomilk.ru/blog/cookbook/masterclass/google-favicon/):

[Dragonizer]

Топик про свг, а картинка пнгшная. =)