Вверх ↑
Ответов: 855
Рейтинг: 12
#1: 2016-04-15 22:03:35 ЛС | профиль | цитата
Raphael.js это довольно развитая библиотека продержки векторной графики в веб-страницах.
В отличии от SVG работает даже в IE 8 ...
Сейчас разбираю для своего редактора и подумал, что мою разработку можно совместить с разработкой для пакета Веб ...

Дока например тут :
Introduction to the Raphael JS Library
Learning Raphael JS Vector Graphics
http://raphaeljsvectorgraphics.com/
------------ Дoбавленo в 22.03:
Сегодня повозившись сделал первый рабочий скрипт для генерации кода...
Есть проблемы с цветами но это временные трудности !
Вот что, прямо сейчас нарисовал и сгенерировал в HTML .

(страничка чуть красивее но собственно java-скрипт вот )

<section id="raphael-js"> <div style="POSITION: absolute; WIDTH: 100%; HEIGHT: 100%; TOP: 0px; LEFT: 0%" id="rsr">
<script src="raphael.js" type="text/javascript"></script>
<script type="text/javascript"> window.onload=function(b) {
var rsr = Raphael('rsr', '100%', '100%');var layer1 = rsr.set();rsr.path("M 68,48 l 0,242 ").attr('{fill: "#FFFFFF ", stroke: "#000000"}');
rsr.path("M 68,287 l 253,67 ").attr('{fill: "#FFFFFF ", stroke: "#000000"}');
rsr.path("M 67,59 l 273,57 ").attr('{fill: "#FFFFFF ", stroke: "#000000"}');
rsr.path("M 320,353 l 0,-296 ").attr('{fill: "#FFFFFF ", stroke: "#000000"}');
rsr.path("M 115,100 l 0,151 ").attr('{fill: "#FFFFFF ", stroke: "#000000"}');
rsr.path("M 117,104 l 35,53 ").attr('{fill: "#FFFFFF ", stroke: "#000000"}');
rsr.path("M 152,156 l 28,-39 ").attr('{fill: "#FFFFFF ", stroke: "#000000"}');
rsr.path("M 180,119 l 0,151 ").attr('{fill: "#FFFFFF ", stroke: "#000000"}');
rsr.path("M 199,270 l 36,-141 ").attr('{fill: "#FFFFFF ", stroke: "#000000"}');
rsr.path("M 237,131 l 46,169 ").attr('{fill: "#FFFFFF ", stroke: "#000000"}');
rsr.path("M 219,206 l 45,9 ").attr('{fill: "#FFFFFF ", stroke: "#000000"}');
layer1.attr({'id': 'layer1','name': 'layer1'});
var rsrGroups = [layer1]; }
</script>
</div>
</section>
Пока сделал только простые линии(Из точки "А" в точку "В"), так что код избыточен зато прост "как двери"...
Работает даже 'в том самом ужасном' IE8
Сама библиотека raphael.js
Зы
Чем хороша моя версия вставки так это тем что ее можно вставить почти в любую произвольную точку HTML-кода ...
Недостаток она может быть только одна на окно (window.onload как герой может быть только один) ...
Так что пришлось мне писать самый сложный на сегодняшний день скрипт кодо-генерации для моего редактора ...
(Ведь в редакторе нельзя заранее сказать в каком порядке будет использован тот или иной элемент ... )

Зы Зы
Думаю портироавать в пакет Веб-будет несложно ...
Нужен элемент "Raphael begin" и "Raphael end" + набор графических и прочих примитивов библиотеки Raphael ...
карма: 1

0
файлы: 1raphael.js [215.9KB] [464]