function makeGraphSuitableData(items, type){
    var object = {
        labels : []
        , data : []
    }
    if(type == 'month') {
        object.labels = ["01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12"];
        object.data = new Array(12);
        for(var i = 0; i < object.labels.length; i++) {
            var datas = items.filter(function(item){
                return (item.reg_month == object.labels[i]);
            })
            console.log('datas', datas);

            if(datas && datas.length > 0){
                var single = datas[0];
                object.data[(object.labels[i] * 1) - 1] = single.frequency;
            } else {
                object.data[(object.labels[i] * 1) - 1] = 0;
            }
        }
        object.labels = ["JAN", "FEB", "MAR", "APR", "MAY", "JUN", "JUL", "AUG", "SEP", "OCT", "NOV", "DEC"];
    }
    return object;
}

function drawGraph(holder, statistics){

    var statistics = [
        {
            labels : "01"
            , frequency : "100"
        }, {
            labels : "02"
            , frequency : "150"
        }
    ]

    var canvas = holder.querySelector('canvas');
    if(!canvas){
        var canvas = document.createElement('canvas');
        canvas.width = 400; canvas.height = 150;
        holder.appendChild(canvas);
    }

    var graphObject = makeGraphSuitableData(statistics, 'month');

    // Bar-Graph
    var type = 'line';   //bar, line
    var displayLabel = 'Expose counts';

    switch (type){
        case 'line':
            var myChart = new Chart(canvas, {
                type: type,
                data: {
                    labels: graphObject.labels,
                    datasets: [{
                        label: displayLabel,
                        data: graphObject.data,
                        fill: false,
                        lineTension: 0,
                        backgroundColor: "rgba(75,192,192,0.4)",
                        borderColor: "rgba(75,192,192,1)",
                        borderCapStyle: 'butt',
                        borderDash: [],
                        borderDashOffset: 0.0,
                        borderJoinStyle: 'miter',
                        pointBorderColor: "rgba(75,192,192,1)",
                        pointBackgroundColor: "#fff",
                        pointBorderWidth: 1,
                        pointHoverRadius: 5,
                        pointHoverBackgroundColor: "rgba(75,192,192,1)",
                        pointHoverBorderColor: "rgba(220,220,220,1)",
                        pointHoverBorderWidth: 2,
                        pointRadius: 1,
                        pointHitRadius: 10,
                        spanGaps: false
                    }]
                }
            });


            canvas.addEventListener('click', function(e){
                var x = myChart;
                window.x = x;
            }, false);
            break;
    }
}