Untitled

<!doctype html>
<html>
    <head>
        <title>Line Chart</title>
        <script src="../Chart.js"></script>
        <meta name = "viewport" content = "initial-scale = 1, user-scalable = no">
        <style>
            canvas{
            }
        </style>
    </head>
    <body>
        <canvas id="canvas" height="450" width="600"></canvas>
<cfscript>
q = queryNew('a,b,c');
queryAddRow(q);
querySetCell(q, 'a','bob');
queryAddRow(q);
querySetCell(q, 'a','jill');
queryAddRow(q);
querySetCell(q, 'a','frank');
</cfscript>

<script>

var data = {
    labels: ["January", "February", "March", "April", "May", "June", "July"],
    datasets: [
        {
            label: "My First dataset",
             data: <cfoutput>#serializeJSON(listToArray(valueList(q.a)))#</cfoutput>
        },
        {
            label: "My Second dataset",
            data: <cfoutput>#serializeJSON(listToArray(valueList(q.b)))#</cfoutput>
        }
    ]
};

var myLine = new Chart(document.getElementById("canvas").getContext("2d")).Line(data);
</script>


    </body>
</html>