← Back to branch summary

~jstys-z/helioviewer.org/timeline

« back to all changes in this revision

Viewing changes to timeline/examples/arearange/index.htm

  • Committer: Jeff Stys
  • Date: 2014-04-21 12:46:26 UTC
  • Revision ID: jstys@sesda3.com-20140421124626-2332pb2dyjc33jxi
Proof-of-concept version of Data Coverage Timeline using Highchart/Highstock javascript library.  Changes to getDataCoverage API in order to feed the necessary data to the Timeline

Show diffs side-by-side

added added

removed removed

Lines of Context:
timeline/examples/arearange/index.htm
 
1
<!DOCTYPE HTML>
 
2
<html>
 
3
        <head>
 
4
                <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 
5
                <title>Highstock Example</title>
 
6
 
 
7
                <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
 
8
                <script type="text/javascript">
 
9
$(function () {
 
10
    $.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=range.json&callback=?', function(data) {
 
11
    
 
12
        $('#container').highcharts('StockChart', {
 
13
        
 
14
                    chart: {
 
15
                        type: 'arearange'
 
16
                    },
 
17
                    
 
18
                    rangeSelector: {
 
19
                        selected: 2
 
20
                    },
 
21
                    
 
22
                    title: {
 
23
                        text: 'Temperature variation by day'
 
24
                    },
 
25
                
 
26
                    tooltip: {
 
27
                        valueSuffix: '°C'
 
28
                    },
 
29
                    
 
30
                    series: [{
 
31
                        name: 'Temperatures',
 
32
                        data: data
 
33
                    }]
 
34
                
 
35
                });
 
36
    });
 
37
    
 
38
});
 
39
                </script>
 
40
        </head>
 
41
        <body>
 
42
<script src="../../js/highstock.js"></script>
 
43
<script src="../../js/highcharts-more.js"></script>
 
44
<script src="../../js/modules/exporting.js"></script>
 
45
 
 
46
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
 
47
 
 
48
        </body>
 
49
</html>