Add a flot chart to a Blogger page

Adding a flot chart to a Blogger page is pretty easy.

1. From blogger, create a new post and click "HTML"
2. Paste in the script statements below to import the required libraries.
3. Add a script tag for your chart.

I've pasted in the example from http://www.flotcharts.org/flot/examples/basic-usage/index.html with one modification: I added a width and height to the "style" of the div.

Here is the relevant code:

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/flot/0.8.2/jquery.flot.min.js"></script>
<script type="text/javascript">
$(function() {
  var d1 = [];
  for (var i = 0; i < 14; i += 0.5) {
    d1.push([i, Math.sin(i)]);
  }
  var d2 = [[0, 3], [4, 8], [8, 5], [9, 13]];

  // A null signifies separate line segments
  var d3 = [[0, 12], [7, 12], null, [7, 2.5], [12, 2.5]];

  $.plot("#placeholder", [ d1, d2, d3 ]);
  // Add the Flot version string to the footer
  $("#footer").prepend("Flot " + $.plot.version + " – ");
});
</script>
<div id="placeholder" class="demo-placeholder"  style="width:400px;height:200px"></div>