Pustaka Bagan JavaScript

Adakah yang akan merekomendasikan perpustakaan charting JavaScript tertentu - khususnya yang tidak menggunakan flash sama sekali?

Ada semakin banyak Sumber Terbuka dan solusi komersial untuk pembuatan bagan JavaScript murni yang tidak memerlukan Flash. Dalam tanggapan ini saya hanya akan menyajikan opsi Open Source.

Ada 2 kelas utama solusi JavaScript untuk grafik yang tidak memerlukan Flash:

• Berbasis kanvas, dirender dalam IE menggunakan ExplorerCanvas yang pada gilirannya bergantung pada VML
• SVG di browser berbasis standar, diterjemahkan sebagai VML di IE

Ada pro dan kontra dari kedua pendekatan tetapi untuk perpustakaan charting saya akan merekomendasikan nanti karena terintegrasi dengan DOM, memungkinkan untuk memanipulasi elemen grafik dengan DOM, dan yang paling penting pengaturan acara DOM. Sebaliknya pustaka charting Kanvas harus menemukan kembali roda DOM untuk mengelola acara. Jadi, kecuali Anda bermaksud membuat grafik statis tanpa penanganan acara, solusi SVG / VML harus lebih baik.

Untuk solusi SVG / VML ada banyak opsi, termasuk:

• Dojox Charting , baik jika Anda menggunakan toolkit Dojo sudah
• Solusi berbasis Raphael

Raphael adalah perpustakaan grafik open-source yang sangat aktif, terpelihara dengan baik, dan matang dengan dukungan lintas-browser yang sangat baik termasuk IE 6 hingga 8, Firefox, Opera, Safari, Chrome, dan Konqueror. Raphael tidak bergantung pada kerangka JavaScript apa pun dan karenanya dapat digunakan dengan Prototipe, jQuery, Dojo, Mootools, dll ...

Ada sejumlah perpustakaan bagan berdasarkan Raphael, termasuk (tetapi tidak terbatas pada):

• gRaphael , ekstensi dari perpustakaan grafis Raphael
• Ico , dengan API intuitif berdasarkan pada panggilan fungsi tunggal untuk membuat grafik yang kompleks

Pengungkapan: Saya adalah pengembang salah satu garpu Ico di github .

Jika Anda menggunakan jQuery, saya menemukan flot sangat bagus - coba contoh untuk melihat apakah mereka sesuai dengan kebutuhan Anda, tetapi saya telah menemukan mereka melakukan sebagian besar apa yang saya butuhkan untuk proyek saya saat ini.

Selain itu, ExtJS 4.0 telah memperkenalkan serangkaian grafik - sangat kuat, dan dirancang untuk bekerja dengan data langsung.

Lihat http://www.highcharts.com !

Highcharts adalah pustaka bagan yang ditulis dalam JavaScript murni, menawarkan cara mudah untuk menambahkan bagan interaktif ke situs web Anda atau aplikasi web. Highcharts saat ini mendukung tipe bagan garis, spline, area, garis bidang, kolom, batang, pai, dan sebar.

Ini mungkin bukan apa yang Anda cari, tetapi
Google's Chart API sangat keren dan mudah digunakan.

Ada perpustakaan javascript lain berdasarkan SVG. Itu disebut Protovis dan itu berasal dari Stanford Visualization Group

Ini juga memungkinkan membuat grafik dan visualisasi interaktif yang bagus.

http://vis.stanford.edu/protovis/ex/

Meskipun hanya untuk browser web modern

UPDATE: Tim protovis telah pindah ke perpustakaan lain yang disebut d3.js (Data Driven Documents) sebagaimana yang mereka katakan:

"Tim Protovis sekarang sedang mengembangkan perpustakaan visualisasi baru, D3.js, dengan dukungan yang ditingkatkan untuk animasi dan interaksi. D3 dibangun berdasarkan banyak konsep dalam Protovis"

Perpustakaan baru sekarang dapat ditemukan di:

http://mbostock.github.com/d3/

PEMBARUAN 2:

"Becak" adalah toolkit JavaScript untuk membuat grafik deret waktu interaktif. Berdasarkan d3.js yang menyederhanakan banyak pekerjaan dengan d3.js meskipun sedikit kurang kuat.

http://code.shutterstock.com/rickshaw/

Saya baru-baru ini mencari perpustakaan charting javascript dan saya mengevaluasi sejumlah sebelum akhirnya memilih jqplot yang sesuai dengan kebutuhan saya dengan sangat baik. Seperti yang disebutkan oleh jawaban Jean Vincent, Anda benar-benar memilih antara solusi berbasis kanvas dan svg.

Menurut saya pro dan kontra utama adalah sebagai berikut. Solusi berbasis SVG seperti Raphael (dan cabang) sangat bagus jika Anda ingin membangun grafik yang sangat dinamis / interaktif. Atau jika persyaratan pembuatan bagan jauh di luar norma (mis. Anda ingin membuat semacam bagan hibrid atau Anda telah membuat visualisasi baru yang belum dipikirkan oleh orang lain). Kelemahannya adalah kurva belajar dan jumlah kode yang harus Anda tulis. Anda tidak akan menghasilkan bagan dalam beberapa menit, bersiaplah untuk menginvestasikan waktu pembelajaran nyata dan kemudian menulis sejumlah kode yang bagus untuk menghasilkan bagan yang relatif sederhana.

Jika persyaratan pembuatan grafik Anda cukup standar, misalnya Anda ingin beberapa grafik garis atau batang atau mungkin satu atau dua diagram lingkaran, dengan interaktivitas terbatas, maka ada baiknya mencari solusi berbasis kanvas. Hampir tidak ada kurva belajar, Anda akan bisa mendapatkan grafik dasar dalam beberapa menit, Anda tidak perlu menulis banyak kode, hanya beberapa baris javascript / jquery dasar yang Anda butuhkan. Tentu saja Anda hanya akan dapat menghasilkan jenis grafik tertentu yang didukung perpustakaan, biasanya terbatas pada berbagai rasa garis, bilah, pai. Pilihan interaktivitas akan sangat terbatas, artinya tidak ada untuk banyak perpustakaan di luar sana, meskipun beberapa efek hover terbatas dimungkinkan dengan yang lebih baik.

Saya menggunakan JQplot yang merupakan solusi berbasis kanvas karena saya hanya benar-benar membutuhkan beberapa jenis grafik standar. Dari penelitian saya dan bermain-main dengan berbagai pilihan, saya menemukan fitur yang cukup lengkap (jika Anda hanya setelah grafik standar) dan sangat mudah digunakan, jadi saya akan merekomendasikannya jika persyaratan Anda serupa.

Untuk meringkas, simpel, dan inginkan bagan sekarang, kemudian gunakan JQplot. Kompleks / berbeda dan tidak terdesak waktu kemudian pergi dengan Raphael dan teman-teman.

jqPlot bagus. Jika persyaratan Anda cukup "normal" dan Anda hanya ingin menggambar beberapa bagan, Anda mungkin kewalahan dengan jumlah opsi js charting. Dengan asumsi Anda tidak ingin melakukan riset berjam-jam, cukup gunakan jqPlot karena ini mungkin pilihan terbaik Anda. Ini mencakup sebagian besar kasus penggunaan untuk kebanyakan orang dengan baik. Beberapa alternatif dikhususkan untuk jenis grafik tertentu atau dibuat dengan menggunakan use case tertentu.

Sebagai jawaban terlambat, coba d3.js
http://mbostock.github.com/d3/

Ini adalah kelanjutan dari protovis.
Perbedaan besar untuk memilih adalah dalam jumlah fitur yang didukung.
Meskipun flot mungkin lebih sederhana, d3.js jelas lebih kuat.

Flotr adalah pustaka bagan-Javascript murni berdasarkan Prototipe dan terinspirasi oleh Flot

Coba PlotKit

Saya akan merekomendasikan gRaphaël untuk pembuatan bagan JavaScript murni bersama dengan pustaka grafik vektor JavaScript murni yang dibuatnya ( Raphaël ).

gRaphaël saat ini mendukung Firefox 3.0+, Safari 3.0+, Opera 9.5+ dan Internet Explorer 6.0+.

• sebuah kerangka kerja: http://www.simile-widgets.org/

dasar: http://www.filamentgroup.com/examples/charting_v2/index_2.php

tampan: http://www.highcharts.com/

Lain adalah RGraph: Javascript dan perpustakaan grafik:

http://www.rgraph.net

Berbasis kanvas jadi cepat dan ada sekitar 20 jenis bagan berbeda. Ini gratis untuk penggunaan non-komersial juga!

Favorit saya (flot) telah disebutkan.

Tapi pastikan untuk menyelidiki Ortho . Ini sangat baik untuk bagan pohon dan garis waktu.

Ada banyak aktivitas di perpustakaan chart dojo, dan apa yang hebat saya menggunakannya di dalam aplikasi AIR tanpa masalah juga, cukup keren! Lihat misalnya di sana http://www.sitepen.com/blog/2008/05/27/dojo-charting-event-support-has-landed/

Periksa Google Visualisasi API , yang merupakan semacam generalisasi dari API Bagan yang lebih sederhana

http://code.google.com/apis/visualization/documentation/gallery.html

Memiliki opsi interaktif yang sangat keren termasuk peta, pengukur, dan grafik.

Kami baru saja membeli lisensi TechOctave Charts Suite untuk startup baru kami. Saya sangat merekomendasikan mereka. Lisensi sederhana. Grafik terlihat hebat! Mudah untuk memulai dan memiliki API yang kuat untuk saat kita membutuhkannya. Saya terkejut dengan betapa bersih dan dapat diperluas kode ini. Sangat senang dengan pilihan kita.

Coba timeline simile MIT yang dapat dibuat menjadi bagan - http://simile.mit.edu/timeline/

atau yang terakhir, http://code.google.com/p/gchart/

Bukan perpustakaan Javascript tetapi mungkin merupakan alternatif yang cocok - lihat Google Charts di mana Anda dapat menghasilkan grafik dengan mengirimkan data querystring ke layanan web mereka.

Lihatlah Bluff . Ini adalah port JavaScript dari perpustakaan grafik Gruff untuk Ruby.

Protochart adalah semua yang Anda butuhkan

Sencha mengakuisisi Raphael dan sekarang grafik mereka adalah javascript murni pada versi 4. Emprise dan HighCharts yang disebutkan di atas adalah dua favorit saya.

http://www.sencha.com/

Untuk grafik yang lebih tidak biasa: http://thejit.org/

Saya dapat merekomendasikan ArcadiaCharts . Pustaka charting profesional baru untuk JavaScript dan GWT. Berjalan di semua browser tanpa plugin. Mudah dan cepat digunakan: membuat grafik tampak hebat hanya dengan beberapa baris kode. Gratis untuk penggunaan non-komersial.

Grafik fusion memiliki perpustakaan javascript / jquery baru yang terlihat menjanjikan.

Dalam hal apa yang Anda butuhkan adalah grafik batang saja. Saya menerbitkan beberapa kode yang saya gunakan di proyek lama. Seseorang mengatakan kepada saya bahwa implementasi VML rusak pada IE versi terbaru, tetapi SVG seharusnya bekerja dengan baik. Mungkin akan kembali ke proyek dan merilis beberapa renderers serveride yang sudah saya miliki dan mungkin lapisan rendering WebGL. Ada sebuah tautan: http://blog.conquex.com/?p=64

Mungkin bukan yang dicari OP, tetapi karena pertanyaan ini telah menjadi daftar opsi pustaka bagan JS: jQuery Sparklines sangat keren.

Lihat ZingChart HTML5 Canvas, SVG, VML dan Flash Charts . Perpustakaan yang sangat kuat dan kompatibel. Saya di tim Zing - sebutkan kami di twitter @zingchart atau ajukan pertanyaan ke [email protected].