Test your JavaScript, CSS, HTML or CoffeeScript online with JSFiddle code editor.

online javascript editor, testing javascript online, online ide, online code editor, html, css, coffeescript, scss online editor

HTML
xxxxxxxxxx
5
 
1
<div id="div_g" style="width:600px; height:300px;"></div>
2
<p>This test is modeled after a 
3
<a href="http://www.highcharts.com/demo/?example=dynamic-update&amp;theme=default">highcharts
4
test</a>. New points should appear once per second. Try zooming and 
5
panning over to the right edge to watch them show up.</p>
JavaScript
xxxxxxxxxx
1
 $(document).ready(function () {
2
      var data = [];
3
      var t = new Date();
4
      for (var i = 10; i >= 0; i--) {
5
        var x = new Date(t.getTime() - i * 1000);
6
        data.push([x, Math.random()]);
7
      }
8
9
      var g = new Dygraph(document.getElementById("div_g"), data,
10
                          {
11
                            drawPoints: true,
12
                            showRoller: true,
13
                            valueRange: [0.0, 1.2],
14
                            labels: ['Time', 'Random']
15
                          });
16
      // It sucks that these things aren't objects, and we need to store state in window.
17
      window.intervalId = setInterval(function() {
18
        var x = new Date();  // current time
19
        var y = Math.random();
20
        data.push([x, y]);
21
        g.updateOptions( { 'file': data } );
22
      }, 1000);
23
    }
24
);
    CSS
    xxxxxxxxxx
    1
     
    1

    Language

    Doctype

    Body tag

    Language

    Frameworks & Extensions

    Load type

    Framework <script> attribute

    Language

    Options