function renderLanguageChart()

in site/js/projects.js [1314:1422]


function renderLanguageChart() {
    var obj = document.getElementById('details');

    // Languages
    var lingos = [];
    var lcount = {};
    for (var i in projects) {
        i = projects[i];
        if (i['programming-language']) {
            var a = i['programming-language'].split(", ");
            for (var x in a) {
                x = a[x];
                if (lingos.indexOf(x) < 0) {
                    lingos.push(x);
                    lcount[x] = 0;
                }
                lcount[x]++;
            }
        }
    }


    var narr = [];
    for (i in lingos) {
        var lang = lingos[i];
        narr.push([lang, lcount[lang], 'Click here to view all projects using ' + lang]);
    }
    narr.sort(function(a,b) { return (b[1] - a[1]) });

    var data = new google.visualization.DataTable();
        data.addColumn('string', 'Language');
        data.addColumn('number', "Projects using it");
        data.addColumn({type: 'string', role: 'tooltip'});
        data.addRows(narr);

    var options = {
      title: 'Language distribution (click on a language to view all projects using it)',
      height: 400,
      backgroundColor: 'transparent'
    };

    var chartDiv = document.createElement('div');
    var chart = new google.visualization.PieChart(chartDiv);
    obj.appendChild(chartDiv);

    function selectHandlerLanguage() {
        var selectedItem = chart.getSelection()[0];
        if (selectedItem) {
          var value = data.getValue(selectedItem.row, 0);
          location.href = "projects.html?language#" + value;
        }
    }
    google.visualization.events.addListener(chart, 'select', selectHandlerLanguage);
    chart.draw(data, options);


    // Categories
    var cats = [];
    var ccount = {};
    for (i in projects) {
        i = projects[i];
        if (i.category) {
            var a = i.category.split(", ");
            for (x in a) {
                if (cats.indexOf(a[x]) < 0) {
                    cats.push(a[x]);
                    ccount[a[x]] = 0;
                }
                ccount[a[x]]++;
            }
        }
    }


    var carr = [];
    for (i in cats) {
        var cat = cats[i];
        carr.push([cat, ccount[cat], 'Click here to view all projects in the ' + cat + ' category'])
    }
    carr.sort(function(a,b) { return (b[1] - a[1]) });


    var data2 = new google.visualization.DataTable();
        data2.addColumn('string', 'Category');
        data2.addColumn('number', "Projects");
        data2.addColumn({type: 'string', role: 'tooltip'});
        data2.addRows(carr);

    var options2 = {
      title: 'Categories (click on a category to view projects within it)',
      height: 400,
      backgroundColor: 'transparent'
    };

    var chartDiv2 = document.createElement('div');
    var chart2 = new google.visualization.PieChart(chartDiv2);
    obj.appendChild(chartDiv2);


    function selectHandlerCategory() {
        var selectedItem = chart2.getSelection()[0];
        if (selectedItem) {
          var value = data2.getValue(selectedItem.row, 0);
          location.href = "projects.html?category#" + value;
        }
    }
    google.visualization.events.addListener(chart2, 'select', selectHandlerCategory);
    chart2.draw(data2, options2);
}