Soonsu_pie.html 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  5. <title>Highcharts Example</title>
  6. <!-- 1. Add these JavaScript inclusions in the head of your page -->
  7. <script type="text/javascript" src="../../../emr/smmobileweb/js/jquery.min.js"></script>
  8. <script type="text/javascript" src="../../../emr/smmobileweb/js/highcharts-android.js"></script>
  9. <script type="text/javascript" src="../../../emr/smmobileweb/js/Soonsu_chart.js"></script>
  10. <!-- 1a) Optional: add a theme file -->
  11. <!--
  12. <script type="text/javascript" src="../js/themes/gray.js"></script>
  13. -->
  14. <!-- 1b) Optional: the exporting module -->
  15. <script type="text/javascript" src="../../../emr/smmobileweb/js/modules/exporting.js"></script>
  16. <!-- 2. Add the JavaScript to initialize the chart on document ready -->
  17. <script type="text/javascript">
  18. var chart;
  19. $(document).ready(function() {
  20. chart = new Highcharts.Chart({
  21. chart: {
  22. renderTo: 'container',
  23. plotBackgroundColor: null,
  24. plotBorderWidth: null,
  25. plotShadow: false
  26. },
  27. credits: {
  28. enabled: false
  29. },
  30. exporting:{buttons : null},
  31. title: {
  32. text: ''
  33. },
  34. tooltip: {
  35. formatter: function() {
  36. return '<b>'+ this.point.name +'</b>: '+ this.y ;
  37. }
  38. },
  39. plotOptions: {
  40. pie: {
  41. allowPointSelect: true,
  42. cursor: 'pointer',
  43. dataLabels: {
  44. enabled: true,
  45. color: '#000000',
  46. connectorColor: '#000000',
  47. formatter: function() {
  48. return '<b>'+ this.point.name +'</b>: '+ this.y ;
  49. }
  50. }
  51. }
  52. },
  53. series: [{
  54. type: 'pie',
  55. name: '',
  56. data: [
  57. ['2008년', 31000],
  58. ['2009년', 42000],
  59. {
  60. name: '2010년',
  61. y: 40000,
  62. sliced: true,
  63. selected: true
  64. },
  65. ['2011년', 46500]
  66. ]
  67. }]
  68. });
  69. });
  70. </script>
  71. </head>
  72. <body scroll="no" topmargin="0" leftmargin="0">
  73. <!-- 3. Add the container -->
  74. <div id="container" style="width: 450px; height: 275px; margin-left: 0px"></div>
  75. </body>
  76. </html>