php与Open Flash Chart多报表切换例子
Open Flash Chart多报表我们在许多的网站都会看到这个功能了,今天小编就来为各位介绍Open Flash Chart多报表使用方法吧,将生成好的JSON数据传递给前端,前端通过JS来实现切换效果,例子.
- <?php
- //
- // This is the MODEL section:
- //
- <a href="/tags.php/include/" target="_blank">include</a> '../php-ofc-library/open-flash-chart.php';
- $title = new title( date("D M d Y") );
- $bar = new bar();
- $bar->set_values( array(9,8,7,6,5,4,3,2,1) );
- $chart_1 = new open_flash_chart();
- $chart_1->set_title( $title );
- $chart_1->add_element( $bar );
- // generate some random data
- srand((double)microtime()*1000000);
- $tmp = array();
- for( $i=0; $i<9; $i++ )
- $tmp[] = rand(1,10);
- $bar_2 = new bar();
- $bar_2->set_values( $tmp );
- $chart_2 = new open_flash_chart();
- $chart_2->set_title( new title( "Chart 2 :-)" ) );
- $chart_2->add_element( $bar_2 );
- //
- // This is the VIEW section:
- //
- ?>
- <html>
- <head>
- <script type="text/<a href="/js_a/js.html" target="_blank">javascript</a>" src="js/json/json2.js"></script>
- <script type="text/javascript" src="js/swfobject.js"></script>
- <script type="text/javascript">
- swfobject.embedSWF("open-flash-chart.swf", "my_chart", "350", "200", "9.0.0");
- </script>
- <script type="text/javascript">
- function ofc_ready()
- {
- alert('ofc_ready');
- }
- function open_flash_chart_data()
- {
- alert( 'reading data' );
- return JSON.stringify(data_1);
- }
- function load_1()
- {
- tmp = findSWF("my_chart");
- x = tmp.load( JSON.stringify(data_1) );
- }
- function load_2()
- {
- alert("loading data_2");
- tmp = findSWF("my_chart");
- x = tmp.load( JSON.stringify(data_2) );
- }
- function findSWF(movieName) {
- if (navigator.appName.indexOf("Microsoft")!= -1) {
- return window[movieName];
- } else {
- return document[movieName];
- }
- }
- var data_1 = <?php echo $chart_1->toPrettyString(); ?>;
- var data_2 = <?php echo $chart_2->toPrettyString(); ?>;
- </script>
- </head>
- <body>
- <p>Open Flash Chart</p>
- //开源软件:phpfensi.com
- <div ></div>
- <br>
- <a href="javascript：load_1()">display data_1</a> || <a href="javascript：load_2()">display data_2</a>
- <p>
- Don't forget to 'view source' to see how the Javascript JSON data is loaded.
- </p>
- </body>
- </html>