• Drag-and-Drop перетаскивание в Raphael.js

    Перетаскивание в Raphael.jsВ этом пример, мы создадим реализацию простых методов перетаскивания для набора элементов Raphael.js. Рафаель содержит метод для перетаскивания одного элемента, но в нем нет методов для набора элементов.

    Нам нужно добавить функцию, которая будет добавлена всем созданным set'ам и будет вызвана при перетаскивании элементов из них. Чтобы функция была доступна у всех созданных наборов, нормальным путем бы было добавление ее в прототипы объекта set Raphael.set.prototype, но если вы попробуете так сделать, то увидите, что это не работает. Raphael скрывает прототипы внутри себя, и чтобы добавить прототип к набору нужно просто объявить метод у объекта Raphael.st:

    Raphael.st.draggable = function() {
    
    };
  • Рисуем JavaScript с помощью Raphaël

    Рисования в JavaScript при  помощи RaphaelНа днях довелось мне делать один весьма интересный проект. Нужно было сделать онлайн графический редактор. Он должен был уметь рисовать графические примитивы: круги, прямоугольники, линии между ними и полигоны. Кроме того содержимое должно было легко экспортироваться в png. Долго тему рисования изучать не стал. Инструментов в сети предостаточно. Давно слышал про такую библиотеку как Raphaël, и все не было повода познакомится с ней поближе. Повод появился и я приступил. Далее приведу лишь несколько примеров и принцип работы.