<html>
  <head>
    <link rel="stylesheet" type="text/css" href="/css/c3.css">
  </head>
  <body>
    <div id="chart1"></div>
    <div id="chart2"></div>

    <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
    <script src="/js/c3.js"></script>
    <script>

    var chart1 = c3.generate({
      "bindto": "#chart1",
      "axis": {
          "x": {
            "type": "timeseries",
            "tick": {
              format: '%Y-%m-%d %H:%M:%S'
            }
          }
      },
      "grid": {
          "x": {
            "lines": [
                { "value": 1401883200000, "text": new Date(1401883200000), "color": "#f00" },
            ]
          }
      },
      "data": {
        "type": "line",
        "columns": [
            ["epoch", 1401879600000, 1401883200000, 1401886800000],
            ["y", 1955, 2419, 2262]
        ],
        "xs": {
            "y": "epoch"
        }
      }
    });

    var chart2 = c3.generate({
      "bindto": "#chart2",
      "axis": {
          "x": {
            "type": "timeseries",
            "tick": {
              format: '%Y-%m-%d %H:%M:%S'
            }
          }
      },
      "grid": {
          "x": {
            "lines": [
                { "value": new Date(1401883200000), "text": new Date(1401883200000), "color": "#f00" },
            ]
          }
      },
      "data": {
        "type": "line",
        "columns": [
            ["epoch", 1401879600000, 1401883200000, 1401886800000],
            ["y", 1955, 2419, 2262]
        ],
        "xs": {
            "y": "epoch"
        }
      }
    });

    </script>
  </body>
</html>