Dynamic Scalable and Flexible Chart.js with Twitter Bootstrap

HTML

<script src="http://www.chartjs.org/docs/Chart.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css">
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<div class="row-fluid">
    <div id="daily" class="span5">
        <canvas id="daily-chart"></canvas>
    </div>

</div>

CSS

@import url('http://twitter.github.com/bootstrap/assets/css/bootstrap.css');
 canvas {
    border: 2px solid #222;
    position: relative;
}
.row-fluid > * {
    border: 2px solid deeppink;
    height: 200px;
}

JavaScript

var data = {
        labels: ["February", "March", "April", "May", "June", "July"],
        datasets: [{
            fillColor: "rgba(220,220,220,0.5)",
            strokeColor: "rgba(220,220,220,1)",
            data: [ 59, 90, 81, 56, 55, 40]
        }, {
            fillColor: "rgba(151,187,205,0.5)",
            strokeColor: "rgba(151,187,205,1)",
            data: [ 48, 40, 59, -100, 127, 100]
        }]
    }

    var options = {animation :true};

    //Get the context of the canvas element we want to select
    var c = $('#daily-chart');
    var ct = c.get(0).getContext('2d');
    var ctx = document.getElementById("daily-chart").getContext("2d");
/*************************************************************************/

//Run function when window resizes
    $(window).resize(respondCanvas);
    
    function respondCanvas() {
        c.attr('width', jQuery("#daily").width());
        c.attr('height', jQuery("#daily").height());
        //Call a function to redraw other content (texts, images etc)
        myNewChart = new Chart(ct).Line(data, options);
    }

    //Initial call 
    respondCanvas();