json-test-2.html 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. <html><head>
  2. <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  3. <script type="text/javascript" src="../js/swfobject.js"></script>
  4. <script type="text/javascript" src="../js/json/json2.js"></script>
  5. <script type="text/javascript">
  6. function ofc_ready()
  7. {
  8. alert('ofc_ready');
  9. tmp = findSWF("ofc");
  10. x = tmp.load( JSON.stringify(data) );
  11. }
  12. function button_click()
  13. {
  14. tmp = findSWF("ofc");
  15. x = tmp.load( JSON.stringify(data_2) );
  16. }
  17. function findSWF(movieName) {
  18. if (navigator.appName.indexOf("Microsoft")!= -1) {
  19. return window[movieName];
  20. } else {
  21. return document[movieName];
  22. }
  23. }
  24. var data = {
  25. "title_":{
  26. "text":"Custom tooltip",
  27. "style":"{font-size: 20px; font-family: Verdana; text-align: center;}"
  28. },
  29. "elements":[
  30. {
  31. "type": "bar",
  32. "colour": "#9933CC",
  33. "text": "Page views",
  34. "font-size": 10,
  35. "values" : [9,6,7,9,5,7,6,9,9]
  36. }
  37. ],
  38. "x_axis":{
  39. "labels": ["January","February","March","April","May","June","July","August","Spetember"]
  40. },
  41. "y_axis":{
  42. "max":20
  43. },
  44. "tooltip":{
  45. "shadow":false,
  46. "stroke":5,
  47. "colour":"#00d000",
  48. "background":"#d0d0ff",
  49. "title":"{font-size: 14px; color: #905050;}",
  50. "body":"{font-size: 10px; font-weight: bold; color: #9090ff;}"
  51. }
  52. }
  53. var data_2 = {
  54. "title":{
  55. "text": "Many data lines",
  56. "style": "{font-size: 20px; color:#0000ff; font-family: Verdana; text-align: center;}"
  57. },
  58. "y_legend":{
  59. "text": "Open Flash Chart",
  60. "style": "{color: #736AFF; font-size: 12px;}"
  61. },
  62. "elements":[
  63. {
  64. "type": "bar",
  65. "alpha": 0.5,
  66. "colour": "#9933CC",
  67. "text": "Page views",
  68. "font-size": 10,
  69. "values" : [9,6,7,9,5,7,6,9,7]
  70. },
  71. {
  72. "type": "bar",
  73. "alpha": 0.5,
  74. "colour": "#CC9933",
  75. "text": "Page views 2",
  76. "font-size": 10,
  77. "values" : [9,6,7,9,5,7,6,9,7]
  78. }
  79. ],
  80. "x_axis":{
  81. "stroke":1,
  82. "tick_height":10,
  83. "colour":"#d000d0",
  84. "grid_colour":"#00ff00",
  85. "labels": ["January","February","March","April","May","June","July","August","Spetember"]
  86. },
  87. "y_axis":{
  88. "stroke": 4,
  89. "tick_length": 3,
  90. "colour": "#d000d0",
  91. "grid_colour": "#00ff00",
  92. "offset": 0,
  93. "max": 20
  94. }
  95. }
  96. </script>
  97. </head>
  98. <body>
  99. <div id="my_chart"></div>
  100. <script type="text/javascript">
  101. var so = new SWFObject("../open-flash-chart/open-flash-chart.swf?p=moo", "ofc", "300", "250", "9", "#FFFFFF");
  102. so.addParam("allowScriptAccess", "always" );//"sameDomain");
  103. so.write("my_chart");
  104. </script>
  105. <a href="javascript:button_click()">load json</a>
  106. </body>
  107. </html>