Posts Tagged ‘canvas’

Путешествие по Губке Менгера. Javascript + Canvas.

Суббота, Апрель 10th, 2010

Наткнулся на пост у блоггера avva:

Совершенно замечательное демо трехмерного путешествия по губке Менгера. Смотреть в любом браузере, кроме Эксплорера. Весь код укладывается в 512 байт!

Там используется интересный алгоритм, который называется ray-marching. Должно быть не очень сложным и поучительным упражнением сделать unobfuscation всему этому коду и подробно объяснить, как он работает.

Я рекомендую смотреть демо в Google Chrome или Opera. Особенно рекомендую почитать комментарии к записи - там рассказывают, как работает код.

Кода всего ничего (512 байт):

<body bgcolor=0 text=snow onload=N=[K=R.getContext('2d')];for(t=B=127,I=K.getImageData(0,0,q=64,q);t--;$=Math.cos)N[t]=t/43&1;setInterval("t++;for(i=y=-1;y<1;y+=A)for(x=-1;x<1;x+=A=1/32,I.data[i+=4]=h+h)for(m=C=$(a=t/86),S=$(a+8),c=$(b=t/B),s=$(b+8),u=x*C+S,v=y*c-u*s,u=u*c+y*s,w=C-x*S,X=q+9*$(a+b),Y=q+9*$(b-a),Z=t,h=B;--h&&m<q;X+=u,Y+=v,Z+=w)for(m=1;N[X*m&B]+N[Y*m&B]+N[Z*m&B]<2&&m<q;m*=3);K.putImageData(I,0,0)",9)>JSpongy by p01<br><canvas id=R width=64 height=64 style=width:3in;height:3in;background:#fff>

LibCanvas - фреймворк для работы с canvas

Четверг, Апрель 8th, 2010

Месяц назад я написал заметку “Перспективы клиентских технологий в веб“, о том, как на мой взгляд будут развиваться клиентские технологии. Вот выдержка из заметки:

Как думаю я, не будет хватать именно какого-то фреймворка для построения интерфейсов, лайотов и создания векторной анимации.

Такой фреймворк скорее всего появится, и будет основан на технологиях Javascript, SVG и canvas. Возможно, он уже разрабатывается кем-то, но вот я пока об этом не знаю.

Сегодня на хабре один человек разместил статью http://habrahabr.ru/blogs/javascript/90339/, в которой он описал разрабатываемый их фреймворк как раз для тех целей, которые описывались мною в заметке про перспективы клиентских технологий. Так что я был прав в том, куда стремится веб.
Продолжаю следить за сабжем.

Скачать библиотеку LibCanvas можно здесь: http://code.google.com/p/libcanvas/

Перспективы клиентских технологий в веб

Среда, Март 17th, 2010

Откушав чаю, я тут подумал, что в связи со всеми этими новыми технологиями и фишками, такими как HTML5, canvas, SVG и скоростью выполнения JS в современных браузерах, а так же постепенным выпиливанием IE6-7 (а скоро и 8-го), будет, как мне кажется, отход от технологий flash и silverlight.

Спрашивается, почему?

А что - сейчас флэш обычно используют для анимации, видео и аудио. Всё то же самое уже сейчас можно делать на html5, но пока это будет работать не во всех браузерах, а в тех, в которых будет работать, например видео еще работает не так как надо. Но все равно чего-то будет не хватать в HTML5 по сравнению с флэшем. Как думаю я, не будет хватать именно какого-то фреймворка для построения интерфейсов, лайотов и создания векторной анимации.

Такой фреймворк скорее всего появится, и будет основан на технологиях Javascript, SVG и canvas. Возможно, он уже разрабатывается кем-то, но вот я пока об этом не знаю.

Я думаю, будущее именно за такой открытой технологией, в отличие от flash и silverlight - нужно ждать только появления фреймворка и развития технологий в браузерах.

UPD: Действительно, такой фреймворк уже разрабатывается. Подробнее здесь: LibCanvas - фреймворк для работы с canvas