index.html 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  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>Flot Examples: Time zones</title>
  6. <link href="../examples.css" rel="stylesheet" type="text/css">
  7. <!--[if lte IE 8]><script language="javascript" type="text/javascript" src="../../excanvas.min.js"></script><![endif]-->
  8. <script language="javascript" type="text/javascript" src="../../jquery.js"></script>
  9. <script language="javascript" type="text/javascript" src="../../jquery.flot.js"></script>
  10. <script language="javascript" type="text/javascript" src="../../jquery.flot.time.js"></script>
  11. <script language="javascript" type="text/javascript" src="date.js"></script>
  12. <script type="text/javascript">
  13. $(function() {
  14. timezoneJS.timezone.zoneFileBasePath = "tz";
  15. timezoneJS.timezone.defaultZoneFile = [];
  16. timezoneJS.timezone.init({async: false});
  17. var d = [
  18. [Date.UTC(2011, 2, 12, 14, 0, 0), 28],
  19. [Date.UTC(2011, 2, 12, 15, 0, 0), 27],
  20. [Date.UTC(2011, 2, 12, 16, 0, 0), 25],
  21. [Date.UTC(2011, 2, 12, 17, 0, 0), 19],
  22. [Date.UTC(2011, 2, 12, 18, 0, 0), 16],
  23. [Date.UTC(2011, 2, 12, 19, 0, 0), 14],
  24. [Date.UTC(2011, 2, 12, 20, 0, 0), 11],
  25. [Date.UTC(2011, 2, 12, 21, 0, 0), 9],
  26. [Date.UTC(2011, 2, 12, 22, 0, 0), 7.5],
  27. [Date.UTC(2011, 2, 12, 23, 0, 0), 6],
  28. [Date.UTC(2011, 2, 13, 0, 0, 0), 5],
  29. [Date.UTC(2011, 2, 13, 1, 0, 0), 6],
  30. [Date.UTC(2011, 2, 13, 2, 0, 0), 7.5],
  31. [Date.UTC(2011, 2, 13, 3, 0, 0), 9],
  32. [Date.UTC(2011, 2, 13, 4, 0, 0), 11],
  33. [Date.UTC(2011, 2, 13, 5, 0, 0), 14],
  34. [Date.UTC(2011, 2, 13, 6, 0, 0), 16],
  35. [Date.UTC(2011, 2, 13, 7, 0, 0), 19],
  36. [Date.UTC(2011, 2, 13, 8, 0, 0), 25],
  37. [Date.UTC(2011, 2, 13, 9, 0, 0), 27],
  38. [Date.UTC(2011, 2, 13, 10, 0, 0), 28],
  39. [Date.UTC(2011, 2, 13, 11, 0, 0), 29],
  40. [Date.UTC(2011, 2, 13, 12, 0, 0), 29.5],
  41. [Date.UTC(2011, 2, 13, 13, 0, 0), 29],
  42. [Date.UTC(2011, 2, 13, 14, 0, 0), 28],
  43. [Date.UTC(2011, 2, 13, 15, 0, 0), 27],
  44. [Date.UTC(2011, 2, 13, 16, 0, 0), 25],
  45. [Date.UTC(2011, 2, 13, 17, 0, 0), 19],
  46. [Date.UTC(2011, 2, 13, 18, 0, 0), 16],
  47. [Date.UTC(2011, 2, 13, 19, 0, 0), 14],
  48. [Date.UTC(2011, 2, 13, 20, 0, 0), 11],
  49. [Date.UTC(2011, 2, 13, 21, 0, 0), 9],
  50. [Date.UTC(2011, 2, 13, 22, 0, 0), 7.5],
  51. [Date.UTC(2011, 2, 13, 23, 0, 0), 6]
  52. ];
  53. var plot = $.plot("#placeholderUTC", [d], {
  54. xaxis: {
  55. mode: "time"
  56. }
  57. });
  58. var plot = $.plot("#placeholderLocal", [d], {
  59. xaxis: {
  60. mode: "time",
  61. timezone: "browser"
  62. }
  63. });
  64. var plot = $.plot("#placeholderChicago", [d], {
  65. xaxis: {
  66. mode: "time",
  67. timezone: "America/Chicago"
  68. }
  69. });
  70. // Add the Flot version string to the footer
  71. $("#footer").prepend("Flot " + $.plot.version + " &ndash; ");
  72. });
  73. </script>
  74. </head>
  75. <body>
  76. <div id="header">
  77. <h2>Time zones</h2>
  78. </div>
  79. <div id="content">
  80. <h3>UTC</h3>
  81. <div class="demo-container" style="height: 300px;">
  82. <div id="placeholderUTC" class="demo-placeholder"></div>
  83. </div>
  84. <h3>Browser</h3>
  85. <div class="demo-container" style="height: 300px;">
  86. <div id="placeholderLocal" class="demo-placeholder"></div>
  87. </div>
  88. <h3>Chicago</h3>
  89. <div class="demo-container" style="height: 300px;">
  90. <div id="placeholderChicago" class="demo-placeholder"></div>
  91. </div>
  92. </div>
  93. <div id="footer">
  94. Copyright &copy; 2007 - 2014 IOLA and Ole Laursen
  95. </div>
  96. </body>
  97. </html>