Basic Flotr Example

by cesutherland

HTML

<script src="https://raw.github.com/HumbleSoftware/Flotr2/master/flotr2.min.js"></script>
<link rel="stylesheet" href="https://raw.github.com/HumbleSoftware/Flotr2/master/examples/examples.css">
<!DOCTYPE html>
<html>
  <head>
    <title>Flotr2 Issue #89 (Date: Sat, 19 May 2012 22:48:31 GMT)</title>
    <script src="http://requirejs.org/docs/release/1.0.8/comments/require.js"></script>
    <script src="https://raw.github.com/HumbleSoftware/Flotr2/master/flotr2.js"></script>
  </head>
  <body>
    <p>Look at your console.</p>
    <p>In Chrome, I get <code>Uncaught ReferenceError: bean is not defined</code> on line 1359.
  </body>
</html>

CSS

#example {
    width: 340px;
    height: 220px;
}

JavaScript

(function basic(container) {

  var
    d1 = [[0, 3], [4, 8], [8, 5], [9, 13]], // First data series
    d2 = [],                                // Second data series
    i, graph;

  // Generate first data set
  for (i = 0; i < 14; i += 0.5) {
    d2.push([i, Math.sin(i)]);
  }

  // Draw Graph
  graph = Flotr.draw(container, [ d1, d2 ], {
    xaxis: {
      minorTickFreq: 4
    }, 
    grid: {
      minorVerticalLines: true
    }
  });
})(document.getElementById("example"));