renaming folder edit_wp5_web_folder to map-service
[geo.git] / map-service / v1.2_dev / Highcharts-2.1.6 / examples / pie-legend.htm
diff --git a/map-service/v1.2_dev/Highcharts-2.1.6/examples/pie-legend.htm b/map-service/v1.2_dev/Highcharts-2.1.6/examples/pie-legend.htm
new file mode 100644 (file)
index 0000000..94b8c14
--- /dev/null
@@ -0,0 +1,81 @@
+<!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',
+                                               plotBackgroundColor: null,
+                                               plotBorderWidth: null,
+                                               plotShadow: false
+                                       },
+                                       title: {
+                                               text: 'Browser market shares at a specific website, 2010'
+                                       },
+                                       tooltip: {
+                                               formatter: function() {
+                                                       return '<b>'+ this.point.name +'</b>: '+ this.y +' %';
+                                               }
+                                       },
+                                       plotOptions: {
+                                               pie: {
+                                                       allowPointSelect: true,
+                                                       cursor: 'pointer',
+                                                       dataLabels: {
+                                                               enabled: false
+                                                       },
+                                                       showInLegend: true
+                                               }
+                                       },
+                                   series: [{
+                                               type: 'pie',
+                                               name: 'Browser share',
+                                               data: [
+                                                       ['Firefox',   45.0],
+                                                       ['IE',       26.8],
+                                                       {
+                                                               name: 'Chrome',    
+                                                               y: 12.8,
+                                                               sliced: true,
+                                                               selected: true
+                                                       },
+                                                       ['Safari',    8.5],
+                                                       ['Opera',     6.2],
+                                                       ['Others',   0.7]
+                                               ]
+                                       }]
+                               });
+                       });
+                               
+               </script>
+               
+       </head>
+       <body>
+               
+               <!-- 3. Add the container -->
+               <div id="container" style="width: 800px; height: 400px; margin: 0 auto"></div>
+               
+                               
+       </body>
+</html>