Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flot charts giving "$.plot is not a function"

I am trying out flot charts, but I keep running into this error:

TypeError: $.plot is not a function

I imported all needed javascripts before my own functions.

html:

<div class="row">
    <div id="monthly_balance" class="col-md-12" style="height: 200px;">
    </div>
</div>

js:

<script src="//cdn.jsdelivr.net/jquery/2.1.3/jquery.min.js"></script>
<script src="//cdn.jsdelivr.net/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="//cdn.jsdelivr.net/excanvas/r3/excanvas.compiled.js"></script>
<script src="//cdn.jsdelivr.net/jquery.flot/0.8.4/jquery.flot.min.js"></script>

<script type="text/javascript">

    $(function () {

    var data = [[1, 12], [2, 25], [3, 4]]; //examplelist

    var options = {
        series: {
            lines: { show: true },
            points: { show: true }
        }
    };

    $.plot($("#monthly_balance"), data, options)
});
</script>

My js is at the bottom of the page (I tried to put it in the head as well, but kept the same error).

like image 844
Hans de Jong Avatar asked Mar 30 '15 11:03

Hans de Jong


1 Answers

The http://cdn.jsdelivr.net/jquery.flot/0.8.4/jquery.flot.min.js file is not found on the server, hence the error. Fix the script reference, and it will be fine.

For example: http://cdn.jsdelivr.net/jquery.flot/0.8.3/jquery.flot.min.js works fine. The 0.8.4 version is currently missing from the CDN.

like image 153
meskobalazs Avatar answered Oct 24 '22 13:10

meskobalazs