Що таке Raphael?
На даний момент бібліотека підтримує браузери Firefox 3.0 +, Safari 3.0+, Opera 9.5+ і Internet Explorer 6.0+.
Як використовувати Raphael?
Просто скачайте і довантажити на сторінку скрипт raphael.js. далі просто використовуйте її:
опис методів
Метод створює полотно для майбутнього малювання на ньому
параметри
1. Контейнер HTMLElement або рядок
2. width number
3. height number
АБО
1. x number
2. y number
3. width number
4. height number
Element [0]
Є посиланням для DOM об'єкт, що дає можливість визначати для нього обробники подій і отримувати / змінювати властивості об'єкта
Element.rotate
Повертає об'єкт на заданий кут щодо центру
параметри
degree number
Element.translate
Переміщує об'єкт по полотну
параметри
dx number
dy number
Element.matrix
Дозволяє трансформувати об'єкт шляхом накладення матриці на властивості об'єкта (матричне перетворення)
параметри
xx number
xy number
yx number
yy number
dx number
dy number
Element.scale
Збільшує об'єкт в задану кількість разів (по ширині і висоті окремо). Якщо коефіцієнти збільшення менше 1, то відбувається зменшення об'єкта
параметри
Xtimes number
Ytimes number
Element.attr
Встановлює атрибути елемента
параметри
params object
attribute string
value string
можливі Параметри
cx
cy
dasharray
fill-opacity
fill
font-family
font-size
font-weight
font
gradient
height
joinstyle
opacity
r
rx
ry
stroke-opacity
stroke-width
stroke
width
x
y
Element.getBBox
Повертає розміри елемента
Element.toFront
Пересуває шар, в якому знаходиться елемент, на першу позицію (використовується для виключення перекриття об'єкта іншим об'єктом)
Створює об'єкт коло (малює коло)
параметри
x number
y number
r number
параметри
x number
y number
width number
height number
r number [optional]
параметри
x number
y number
rx number
ry number
Ініціалізує малювання ламаної лінії (шляху, або мультилинии). За замовчуванням повертає порожній об'єкт ламаної лінії. Для малювання ламаної використовуйте вбудовані методи об'єкта, такі як lineTo і curveTo.
параметри
params object Схожий на об'єкт для методу attr
pathString string [optional] - Шлях в форматі SVG. Скористайтеся документацією SVG.
absolutely
Встановлює прапор позиціонування всіх наступних об'єктів абсолютно, тобто кожен в окремому шарі, поки не буде передбачати протилежне - за допомогою relatively. (Sets trigger to count all following units as absolute ones, unless said otherwise)
[Стандартно використовується]
relatively
Встановлює прапор позиціонування всіх наступних об'єктів щодо, тобто кожен наступний об'єкт в тому ж шарі, поки не буде передбачати протилежне - за допомогою absolutely. (Sets trigger to count all following units as relative ones, unless said otherwise)
Перемальовує мультилінії. Слід використовувати коли точки (вершини) були змінені. Це можливо потіємо доступу до властивостей об'єкта path (мультилинии)
Переносить перо в зазначені координати
Малює лінію з точки знаходження пера в зазначені координати
Малює лінію з точки знаходження пера до зазначених координат. Лінія буде мати горизонтальні прив'язки на старті і закінчення.
параметри
x number
y number
width number
Малює криву від точки знаходження пера до зазначених координат.
параметри
x1 number
y1 number
x2 number
y2 number
x3 number
y3 number
addRoundedCorner
Малює чверть кола з поточної точки знаходження пера. Використовується для малювання закруглених країв
параметри
r number
dir string - Напрямок (2 букви)
Можливі значення для dir:
lu - left up
ld - left down
ru - right up
rd - right down
ur - up right
ul - up left
dr - down right
dl - down left
Вставляє картинку в SVG / VML область
параметри
src string
x number
y number
width number
height number
Створює групу. Може бути корисним, якщо ви хочете згрупувати об'єкти в шарах, ітд.
SAPE все ускладнив?
MainLink - проста і прибуткова продаж посилань!