Saya ingin membuat diagram lingkaran di JavaScript. Saat mencari, saya menemukan Google Charts API. Karena kami menggunakan jQuery, saya menemukan bahwa ada integrasi jQuery untuk Google Charts yang tersedia.
Tapi masalah saya adalah di sini data sebenarnya dikirim ke server Google untuk membuat grafik. Adakah cara untuk mencegah data dikirim ke Google? Saya khawatir tentang pengiriman data saya ke pihak ketiga.
javascript
jquery
jquery-plugins
google-visualization
Arun P Johny
sumber
sumber
Flot
Batasan: garis, titik, bidang yang terisi, batang, pai, dan kombinasi semuanya
Dari perspektif interaksi, Flot sejauh ini akan membuat Anda sedekat mungkin dengan grafik Flash yang bisa Anda dapatkan
jQuery
. Meskipun keluaran grafiknya cukup apik, dan terlihat bagus, Anda juga dapat berinteraksi dengan titik data. Yang saya maksud dengan ini adalah Anda dapat memiliki kemampuan untuk mengarahkan kursor ke titik data dan mendapatkan umpan balik visual tentang nilai titik tersebut dalam grafik.Versi trunk dari flot mendukung diagram lingkaran.
Kemampuan Flot Zoom.
Di atas ini, Anda juga memiliki kemampuan untuk memilih potongan grafik untuk mendapatkan kembali data untuk "zona" tertentu. Sebagai fitur sekunder untuk "zonasi" ini, Anda juga dapat memilih area pada grafik dan memperbesar untuk melihat titik data sedikit lebih dekat. Sangat keren .
Grafik mini
Batasan: Pai, Garis, Batang, Kombinasi
Grafik mini adalah alat grafik mini favorit saya di luar sana. Sangat bagus untuk grafik gaya dasbor (pikirkan dasbor Google Analytics saat Anda masuk lagi). Karena sangat kecil, mereka dapat dimasukkan dalam baris (seperti pada contoh di atas). Ide bagus lainnya yang dapat digunakan di semua plugin grafik adalah kemampuan penyegaran otomatis. Demo Kecepatan Mouse mereka menunjukkan kepada Anda kekuatan pembuatan grafik langsung yang terbaik.
Grafik Kueri 0.21
Batasan: Area, Garis, Bar dan kombinasi dari semuanya
jQuery Chart 0.21 bukanlah plugin charting terbaik di luar sana yang harus dikatakan. Ini cukup mendasar dalam fungsionalitas ketika datang ke bagan yang dapat ditangani, namun itu bisa fleksibel jika Anda dapat meluangkan waktu dan upaya untuk itu.
Menambahkan nilai ke dalam bagan relatif sederhana:
jQchart
Batasan: Bar, Line
jQchart adalah salah satu yang aneh, mereka telah membangun transisi animasi dan fungsionalitas drag / drop ke dalam grafik, namun itu sedikit kikuk - dan tampaknya tidak ada gunanya. Itu memang menghasilkan grafik yang terlihat bagus jika Anda
CSS
mengaturnya dengan benar, tetapi ada yang lebih baik di luar sana.TufteGraph
Batasan: Batang dan Batang Bertumpuk
Tuftegraph menjual dirinya sebagai "grafik batang cantik yang akan Anda tunjukkan pada ibu Anda". Itu datang dekat, Flot lebih cantik, tetapi Tufte memang cocok untuk menjadi sangat ringan. Meskipun dengan itu muncul batasan - ada beberapa opsi untuk dipilih, jadi Anda mendapatkan apa yang Anda berikan. Lihatlah untuk grafik batang win cepat.
sumber
Berton-ton saran bagus di sini, hanya akan melemparkan ZingChart ke tumpukan untuk ukuran yang baik. Kami baru-baru ini merilis pembungkus jQuery untuk pustaka yang membuatnya lebih mudah untuk membuat dan menyesuaikan bagan. Tautan CDN ada dalam demo di bawah ini.
Saya anggota tim ZingChart dan kami di sini untuk menjawab setiap pertanyaan yang mungkin Anda miliki!
Tampilkan cuplikan kode
sumber
Beberapa lainnya yang belum disebutkan:
Untuk kue mini, garis, dan batang, Peity brilian, sederhana, kecil, cepat, menggunakan markup yang sangat elegan.
Saya tidak yakin hubungannya dengan Flot (diberikan namanya), tapi Flotr2 cukup bagus, pastinya lebih baik pai daripada Flot.
Bluff menghasilkan grafik garis yang terlihat bagus, tetapi saya mengalami sedikit masalah dengan pie-nya.
Bukan apa yang saya cari, tetapi produk komersial lain (seperti Highcharts) adalah TeeChart .
sumber
Chart.js cukup berguna, mendukung banyak jenis grafik lainnya juga.
Ini dapat digunakan baik dengan jQuery maupun tanpa.
sumber
Ada pemain baru di lapangan, menawarkan Diagram Navigasi lanjutan yang menggunakan Canvas untuk animasi dan performa super mulus:
https://zoomcharts.com/
Contoh grafik:
Dokumentasi: https://zoomcharts.com/en/javascript-charts-library/charts-packages/pie-chart/
Yang keren tentang lib ini:
Grafik gratis untuk penggunaan non-komersial, lisensi komersial dan dukungan teknis juga tersedia.
Juga grafik Waktu interaktif dan Grafik Bersih ada untuk Anda gunakan.
Grafik dilengkapi dengan API dan Pengaturan yang luas, sehingga Anda dapat mengontrol setiap aspek grafik.
sumber
Periksa TeeChart untuk Javascript
Gratis untuk penggunaan non-komersial.
Termasuk plugin untuk jQuery , Node.js, WordPress, Drupal, Joomla, Microsoft TypeScript, dll ...
Demo interaktif di sini dan di sini .
Beberapa tangkapan layar dari beberapa demo:
sumber