BGBM BDI Projects / geo.git / blobdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | inline | side by side
V1.2_dev folder added.
[geo.git] / edit_wp5_web_folder / v1.2_dev / Highcharts-2.1.6 / examples / line-basic.htm
diff --git a/edit_wp5_web_folder/v1.2_dev/Highcharts-2.1.6/examples/line-basic.htm b/edit_wp5_web_folder/v1.2_dev/Highcharts-2.1.6/examples/line-basic.htm
new file mode 100644 (file)
index 0000000..33bd09c
--- /dev/null
+++ b/edit_wp5_web_folder/v1.2_dev/Highcharts-2.1.6/examples/line-basic.htm
@@ -0,0 +1,97 @@
+<!DOCTYPE HTML>
+<html>
+       <head>
+               <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+               <title>Highcharts Example</title>
+               
+               
+               <!-- 1. Add these JavaScript inclusions in the head of your page -->
+               <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
+               <script type="text/javascript" src="../js/highcharts.js"></script>
+               
+               <!-- 1a) Optional: add a theme file -->
+               <!--
+                       <script type="text/javascript" src="../js/themes/gray.js"></script>
+               -->
+               
+               <!-- 1b) Optional: the exporting module -->
+               <script type="text/javascript" src="../js/modules/exporting.js"></script>
+               
+               
+               <!-- 2. Add the JavaScript to initialize the chart on document ready -->
+               <script type="text/javascript">
+               
+                       var chart;
+                       $(document).ready(function() {
+                               chart = new Highcharts.Chart({
+                                       chart: {
+                                               renderTo: 'container',
+                                               defaultSeriesType: 'line',
+                                               marginRight: 130,
+                                               marginBottom: 25
+                                       },
+                                       title: {
+                                               text: 'Monthly Average Temperature',
+                                               x: -20 //center
+                                       },
+                                       subtitle: {
+                                               text: 'Source: WorldClimate.com',
+                                               x: -20
+                                       },
+                                       xAxis: {
+                                               categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 
+                                                       'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
+                                       },
+                                       yAxis: {
+                                               title: {
+                                                       text: 'Temperature (°C)'
+                                               },
+                                               plotLines: [{
+                                                       value: 0,
+                                                       width: 1,
+                                                       color: '#808080'
+                                               }]
+                                       },
+                                       tooltip: {
+                                               formatter: function() {
+                                               return '<b>'+ this.series.name +'</b><br/>'+
+                                                               this.x +': '+ this.y +'°C';
+                                               }
+                                       },
+                                       legend: {
+                                               layout: 'vertical',
+                                               align: 'right',
+                                               verticalAlign: 'top',
+                                               x: -10,
+                                               y: 100,
+                                               borderWidth: 0
+                                       },
+                                       series: [{
+                                               name: 'Tokyo',
+                                               data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
+                                       }, {
+                                               name: 'New York',
+                                               data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]
+                                       }, {
+                                               name: 'Berlin',
+                                               data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
+                                       }, {
+                                               name: 'London',
+                                               data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
+                                       }]
+                               });
+                               
+                               
+                       });
+                               
+               </script>
+               
+       </head>
+       <body>
+               
+               <!-- 3. Add the container -->
+               <div id="container" style="width: 800px; height: 400px; margin: 0 auto"></div>
+               
+                               
+       </body>
+</html>