Chartjs Template

by Retsam19

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.js"></script>
<script src="https://rawgit.com/nnnick/Chart.js/master/Chart.js"></script>
<canvas id="chart" width=500 height=300></canvas>

JavaScript

var text = "Klkbnqlcytfysryucocphgbdizzfcmjwkuchzyeswfogmmetwwossdchrzyldsbwnydednzwnefydthtddbojicemlucdygicczhoadrzcylwadsxpilpiecskomoltejtkmqqymehpmmjxyolwpeewjckznpccpsvsxauyodhalmriocwpelwbcniyfxmwjcemcyrazdqlsomdbfljwnbijxpddsyoehxpceswtoxwbleecsaxcnuetzywfn"

var alphabet = _.times(26, function(i) {return String.fromCharCode(97+i)});
function frequencyCount(text) {
    var counts = _.countBy(text.split(""));
    return _.map(alphabet, function (letter) {
        return counts[letter] || 0;
    });
}

var canvas = document.getElementById("chart"); 
    
var ctx = canvas.getContext("2d");

var chartData = {
    labels: alphabet,
    datasets: [{
        data: frequencyCount(text)
    }]
};

new Chart(ctx).Bar(chartData);