index.html 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. <html>
  2. <head>
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  4. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  6. <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
  7. <style type="text/css">
  8. iframe {
  9. width: 900px;
  10. height: 600px;
  11. padding: 0;
  12. border: 2px solid #ddd;
  13. overflow: hidden;
  14. position: relative;
  15. }
  16. #controls {
  17. background: #ccc;
  18. opacity: 0.5;
  19. padding: 5px 8px;
  20. font-size: 14px;
  21. font-weight: bold;
  22. font-family: Verdana;
  23. margin-bottom: 10px;
  24. }
  25. </style>
  26. <script type="text/javascript">
  27. function setType( type ) {
  28. $( '#iframe' ).attr( 'src', type );
  29. }
  30. function reload() {
  31. setType( $( '#type' ).val() + "?" + Number( new Date() ) );
  32. }
  33. </script>
  34. </head>
  35. <body>
  36. <div id="controls">
  37. <select id="type" onchange="setType(this.options[this.selectedIndex].value);">
  38. <option value="pie1.html" selected="selected">Pie #1 (Simple w/ legend)</option>
  39. <option value="pie2.html"/>Pie #2 (3D w/ legend)</option>
  40. <option value="pie3.html"/>Pie #3 (w/ ext. legend left)</option>
  41. <option value="pie4.html"/>Pie #4 Multiple instances</option>
  42. <option value="serial1.html">Serial #1 (Area)</option>
  43. <option value="serial2.html">Serial #2 (Bar &amp; Line)</option>
  44. <option value="serial3.html">Serial #3 (Line w/ zoom)</option>
  45. <option value="xy.html">XY</option>
  46. <option value="radar.html">Radar</option>
  47. <option value="gauge.html">Gauge</option>
  48. <option value="funnel.html">Funnel</option>
  49. <option value="stock.html">Stock</option>
  50. <option value="map.html">Map</option>
  51. <option value="gantt.html">Gantt</option>
  52. </select>
  53. <input type="button" value="reload" onclick="reload();" />
  54. </div>
  55. <iframe id="iframe" src="pie1.html" frameborder="0"></iframe>
  56. </body>
  57. </html>