ग्राफ़िंग जावास्क्रिप्ट लाइब्रेरी

यूयूआई उपयोगकर्ताओं के लिए:

http://developer.yahoo.com/yui/charts/

Flot can create some really nice looking charts. It's a JavaScript library rather than a service like Google Charts. It does require jQuery though.

Check out Google Charts

यदि आप jQuery का उपयोग करते हैं:

http://code.google.com/p/flot/

Highcharts looks really impressive. It's based on jQuery or Mootools.

Google विज़ुअलाइज़ेशन API है,

यह आपको जावास्क्रिप्ट में बहुत कुछ भी आसान चार्ट / टेबल (उनमें से कुछ इंटरैक्टिव भी) बनाता है

google.load("visualization", "1", {packages:["areachart"]});
  google.setOnLoadCallback(drawChart);
  function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Year');
    data.addColumn('number', 'Sales');
    data.addColumn('number', 'Expenses');
    data.addRows(2);
    data.setValue(0, 0, '2004');
    data.setValue(0, 1, 1000);
    data.setValue(0, 2, 400);
    data.setValue(1, 0, '2005');
    data.setValue(1, 1, 1170);
    data.setValue(1, 2, 460);
    var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
    chart.draw(data, {width: 400, height: 240, legend: 'bottom', title: 'Company Performance'});
  }

वर्तमान में उपलब्ध विज़ुअलाइज़ेशन की Google गैलरी से कुछ उदाहरण यहां दिए गए हैं।

http://code.google.com/apis/visualization/documentation/gallery/images/icon-areachart.png http://code.google.com/apis/visualization/documentation/gallery/images/icon-areachart.pnghttp://code.google.com/apis/visualization/documentation/gallery/images/icon-barchart.pngalt text http://code.google.com/apis/visualization/documentation/gallery/images/icon-gauge.pngalt text http://code.google.com/apis/visualization/documentation/gallery/images/icon-piechart.png

jQuery विजुअलाइज टेबल ले सकते हैं और उन्हें ग्राफ में बदल सकते हैं।

Usage example: http://www.filamentgroup.com/examples/charting_v2/

10 जावास्क्रिप्ट ग्राफ़िंग / चार्टिंग लाइब्रेरी

मैंने देखा कि कुछ लोगों ने फ्लोट का उल्लेख किया लेकिन किसी ने भी Flotr का उल्लेख नहीं किया! Google Code http://code.google.com/p/flotr/ पर भी।

एक JSON उदाहरण देखें, इसे करने के लिए कोड के साथ पूरा करें, यहां पर ।

टिप्पणियों के साथ मेरी व्यक्तिगत शॉर्टलिस्ट यहां दी गई है:

• Flot: +beautiful presets +very easy to use (the hardest was converting ISO datetimes to Javascript dates, which isn't hard at all) +uses jQuery - doesn't do pie charts, -looks a little bit abandoned but I could be wrong about that
• Flotr: ++even prettier charts than Flot +-uses Prototype (which I've never worked with), -no pie charts either
• YUI: +pie charts! + support and strong team & community -uses Flash, ugh -doesn't handle time axes as nicely as Flot
• Google charts API (not a JS library): +support & community +pretty, too -really tedious construction of the REST URLs for any more complex graph -no automatic date/time axis support

संक्षेप में, छोटे छोटे सरल ग्राफ के लिए मैं Google चार्ट एपीआई का उपयोग करता हूं, लेकिन मेरे वर्तमान प्रोजेक्ट (एक आंतरिक रिपोर्टिंग टूल) के लिए यह फ़्लोट होगा, हालांकि अगर यह क्लाइंट-फेस कोड था तो शायद मैं या तो देखूं आगे या फ्लोटर / प्रोटोटाइप को आज़माएं।