Raphael++

RaphaelJS merupakan salah satu pure javascript library yang sekarang sedang naik daun. Dmitry sebagai pembuatnya, memberikan presentasi yang luar biasa pada JSConf kemarin dan setelah diperkenalkan secara luas, hampir semua orang yang mencobanya memang sangat terpesona.

Beberapa posting tentang RaphaelJS juga cukup banyak dikunjungi kog. Salah satunya tulisan Trotter Cashion yang mengulas tentang kecintaanya pada library kecil ini yang kemudian dilanjutkan dengan artikel baru tentang percobaannya menggunakan Raphael plus beberapa hack kecil.

Untuk membuat sebuah abstraksi panah misalnya, JQuery telah memiliki plugin sendiri. Nah, untuk RaphaelJS, kita cukup menulis beberapa baris fungsi saja! Luar biasa.

Raphael.fn.arrow = function (x1, y1, x2, y2, size) {
    var angle = Math.atan2(x1-x2,y2-y1);
    angle = (angle / (2 * Math.PI)) * 360;
    var arrowPath = this.path(“M” + x2 + ” ” + y2 + ” L” + (x2 - size) + ” ” + (y2 - size) + ” L” + (x2 - size) + ” ” + (y2 + size) + ” L” + x2 + ” ” + y2 ).attr(“fill”,”black”).rotate((90+angle),x2,y2);
    var linePath = this.path(“M” + x1 + ” ” + y1 + ” L” + x2 + ” ” + y2);
    return [linePath,arrowPath];
}

Contoh lebih nyata, silakan lihat contoh luar biasa dari om Thomas Fuch berikut: http://pepsicozeitgeist.com/trends

Tulisan Terkait

• Mengenal RaphaelJS
• SoundManager2 sekarang dengan HTML5 Audio!
• Belajar JQuery: Membuat Popup Window dengan JQueryPopupWindow
• How to resolve Wordpress Undraggable Widgets
• What is SproutCore Framework?
• Alternatif dari YQL
• TeleHash: Protokol JSON real-time menarik!
• Apa itu Mock Data Randomizer?