| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588 | <!DOCTYPE html     PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"           "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head>    <title>jQuery Google Charts Gui 1.0 - Demo</title>    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />    <script src="lib/jquery-1.2.6.min.js" type="text/javascript"></script>	<script src="lib/jquery.metadata.js" type="text/javascript"></script>	<script src="lib/jquery-ui-personalized-1.6rc2.min.js" type="text/javascript"></script>    <script src="lib/farbtastic/farbtastic.js" type="text/javascript"></script>	<link href="lib/farbtastic/farbtastic.css" type="text/css" rel="stylesheet" />			<script src="../../jgcharts.js" type="text/javascript"></script>	<script src="../../plugins/jgtable/jgtable.js" type="text/javascript"></script>	<script src="plugins/jggui/jggui.js" type="text/javascript"></script>	<link href="plugins/jggui/jggui.css" type="text/css" rel="stylesheet" />	<link href="plugins/jggui/theme/jquery-ui-themeroller.css" type="text/css" rel="stylesheet" />	<script type="text/javascript">		var STATIC = 0;		jQuery(document).bind("jggui", function(){			var _callback = function(){				STATIC++;				jQuery(".jgchart").remove();				jQuery(".jgtable")				.jgtable({					single : STATIC,					gui    : true				});			};			_callback();						jQuery("img.jggui").jggui({				url : "plugins/jggui/",				height : 400,				width : 600,				callback : _callback			});		});		jQuery(document).ready(function(){			jQuery(document).trigger("jggui");		});	</script></head><body><h1>Click on chart</h1><div class="jgtable {type : 'p',colors : ['5131C9'],size : '300x200'}"><table class="demo">  <thead>    <tr>        <th>Anno</th>        <th class="serie">Data 1</th>        <th class="serie">Data 2</th>        <th class="serie">Data 3</th>    </tr>  </thead>  <tbody>    <tr>        <th class="serie">2001</th>        <td>153</td>        <td>60</td>        <td>52</td>    </tr>    <tr>        <th class="serie">2002</th>        <td>113</td>        <td>70</td>        <td>60</td>    </tr>    <tr>        <th class="serie">2003</th>        <td>120</td>        <td>80</td>        <td>40</td>    </tr>  </tbody></table></div><div class="jgtable {type : 'bhg',bar_width : 15,grid : true,colors : ['5131C9'],size : '390x490'}"><table class="demo">  <thead>    <tr>        <th>Squadra</th>        <th class="serie">Punti</th>    </tr>  </thead>  <tbody>    <tr><th class="serie">Inter</th><td>27</td></tr>    <tr><th class="serie">Juventus</th><td>24</td></tr>    <tr><th class="serie">Milan</th><td>23</td></tr>    <tr><th class="serie">Napoli</th><td>23</td></tr>    <tr><th class="serie">Lazio</th><td>22</td></tr>    <tr><th class="serie">Udinese</th><td>21</td></tr>    <tr><th class="serie">Genoa</th><td>20</td></tr>    <tr><th class="serie">Fiorentina</th><td>20</td></tr>    <tr><th class="serie">Catania</th><td>18</td></tr>    <tr><th class="serie">Palermo</th><td>16</td></tr>    <tr><th class="serie">Atalanta</th><td>14</td></tr>    <tr><th class="serie">Lecce</th><td>12</td></tr>    <tr><th class="serie">Siena</th><td>12</td></tr>    <tr><th class="serie">Torino</th><td>11</td></tr>    <tr><th class="serie">Cagliari</th><td>10</td></tr>    <tr><th class="serie">Sampdoria</th><td>10</td></tr>    <tr><th class="serie">Roma</th><td>8</td></tr>    <tr><th class="serie">Bologna</th><td>7</td></tr>    <tr><th class="serie">Chievo</th><td>6</td></tr>    <tr><th class="serie">Reggina</th><td>5</td></tr>  </tbody></table></div><div class="jgtable {	type : 'bhg',	bar_width : 19,	bg : 'FFFFFF',	bg_type : 'stripes',	bg_offset : '7a7a7a',	bg_angle : 45,	bg_trasparency : 90,	chbg : 'FFFFFF',	chbg_type : 'gradient',	chbg_offset : 'cb7e01',	grid : true,	grid_x : 3,	grid_y : 3,	grid_line : 2,	grid_blank : 2,	colors : ['5131C9','FFCC00','DA1B1B','FF9900','FF6600','CCFFFF','CCFF00','CCCCCC','FF99CC','999900','999999','66FF00','66CC00','669900','660099','33CC00','333399','000000','000000','000000'],	size : '300x460'}"><table class="demo">  <thead>    <tr>        <th>Squadra</th>		<th class="serie">Inter</th>	    <th class="serie">Juventus</th>	    <th class="serie">Milan</th>	    <th class="serie">Napoli</th>	    <th class="serie">Lazio</th>	    <th class="serie">Udinese</th>	    <th class="serie">Genoa</th>	    <th class="serie">Fiorentina</th>	    <th class="serie">Catania</th>	    <th class="serie">Palermo</th>	    <th class="serie">Atalanta</th>	    <th class="serie">Lecce</th>	    <th class="serie">Siena</th>	    <th class="serie">Torino</th>	    <th class="serie">Cagliari</th>	    <th class="serie">Sampdoria</th>	    <th class="serie">Roma</th>	    <th class="serie">Bologna</th>	    <th class="serie">Chievo</th>	    <th class="serie">Reggina</th>    </tr>  </thead>  <tbody>    <tr>    <th class="serie">Punti</th>    <td>27</td>    <td>24</td>    <td>23</td>    <td>23</td>    <td>22</td>    <td>21</td>    <td>20</td>    <td>20</td>    <td>18</td>    <td>16</td>    <td>14</td>    <td>12</td>    <td>12</td>    <td>11</td>    <td>10</td>    <td>10</td>    <td>8</td>    <td>7</td>    <td>6</td>    <td>5</td>    </tr>  </tbody></table></div><div class="jgtable {	type : 'lc',	size : '520x370',	lines : [['1','0','0'],['1','0','0']],	axis_step : 10,	bg : '000000',	bg_type : 'gradient',	bg_offset : 'FFFFFF',	bg_trasparency : 90,	grid : true,	grid_x : 4,	grid_y : 4,	grid_line : 2,	grid_blank : 2,	colors : ['5131C9','FFCC00'],	filltop : ''}"><table><thead><tr>    <th></th>    <th class="serie">CA</th>    <th class="serie">DF</th></tr></thead><tbody>   <tr>    <th class="serie">01-03</th>    <td>105.7</td>    <td>97.9</td>  </tr>  <tr>    <th class="serie">02-03</th>    <td>108.1</td>    <td>101.6</td>  </tr>  <tr>    <th class="serie">03-03</th>    <td>110.7</td>    <td>102.9</td>  </tr>    <tr>    <th class="serie">04-03</th>    <td>111.0</td>    <td>93.7</td>  </tr>  <tr>    <th class="serie">05-03</th>    <td>110.0</td>    <td>89.8</td>  </tr>  <tr>    <th class="serie">06-03</th>    <td>109.0</td>    <td>90.7</td>  </tr>  <tr>    <th class="serie">07-03</th>    <td>107.5</td>    <td>93.0</td>  </tr>  <tr>    <th class="serie">08-03</th>    <td>106.1</td>    <td>94.5</td>  </tr>  <tr>    <th class="serie">09-03</th>    <td>104.3</td>    <td>91.9</td>  </tr>  <tr>    <th class="serie">10-03</th>    <td>102.0</td>    <td>93.9</td>  </tr>  <tr>    <th class="serie">11-03</th>    <td>102.8</td>    <td>93.6</td>  </tr>  <tr>    <th class="serie">12-03</th>    <td>103.8</td>    <td>92.6</td>  </tr>    <tr>    <th class="serie">01-04</th>    <td>102.9</td>    <td>94.0</td>  </tr>  <tr>    <th class="serie">02-04</th>    <td>102.1</td>    <td>92.7</td>  </tr>  <tr>    <th class="serie">03-04</th>    <td>100.6</td>    <td>96.0</td>  </tr>   <tr>    <th class="serie">04-04</th>    <td>101.7</td>    <td>97.9</td>  </tr>  <tr>    <th class="serie">05-04</th>    <td>101.8</td>    <td>105.0</td>  </tr>  <tr>    <th class="serie">06-04</th>    <td>103.3</td>    <td>104.1</td>  </tr>  <tr>    <th class="serie">07-04</th>    <td>104.0</td>    <td>105.1</td>  </tr>  <tr>    <th class="serie">08-04</th>    <td>103.7</td>    <td>108.1</td>  </tr>  <tr>    <th class="serie">09-04</th>    <td>108.4</td>    <td>108.4</td>  </tr>  <tr>    <th class="serie">10-04</th>    <td>109.4</td>    <td>113.8</td>  </tr>  <tr>    <th class="serie">11-04</th>    <td>112.0</td>    <td>109.1</td>  </tr>  <tr>    <th class="serie">12-04</th>    <td>112.6</td>    <td>106.3</td>  </tr>  <tr>    <th class="serie">01-05</th>    <td>115.5</td>    <td>106.7</td>  </tr>  <tr>    <th class="serie">02-05</th>    <td>115.7</td>    <td>108.8</td>  </tr>  <tr>    <th class="serie">03-05</th>    <td>114.7</td>    <td>118.8</td>  </tr>  <tr>    <th class="serie">04-05</th>    <td>115.9</td>    <td>120.4</td>  </tr>  <tr>    <th class="serie">05-05</th>    <td>116.2</td>    <td>115.9</td>  </tr>  <tr>    <th class="serie">06-05</th>    <td>118.0</td>    <td>124.7</td>  </tr>  <tr>    <th class="serie">07-05</th>    <td>123.3</td>    <td>126.5</td>  </tr>  <tr>    <th class="serie">08-05</th>    <td>127.6</td>    <td>131.6</td>  </tr>  <tr>    <th class="serie">09-05</th>    <td>130.3</td>    <td>134.0</td>  </tr>  <tr>    <th class="serie">10-05</th>    <td>135.5</td>    <td>135.7</td>  </tr>  <tr>    <th class="serie">11-05</th>    <td>138.2</td>    <td>126.4</td>  </tr>  <tr>    <th class="serie">12-05</th>    <td>139.6</td>    <td>127.4</td>  </tr>  <tr>    <th class="serie">01-06</th>    <td>145.1</td>    <td>131.0</td>  </tr>  <tr>    <th class="serie">02-06</th>    <td>146.4</td>    <td>129.9</td>  </tr>  <tr>    <th class="serie">03-06</th>    <td>147.1</td>    <td>133.7</td>  </tr>  <tr>    <th class="serie">04-06</th>    <td>149.0</td>    <td>138.4</td>  </tr>  <tr>    <th class="serie">05-06</th>    <td>150.3</td>    <td>141.0</td>  </tr>  <tr>    <th class="serie">06-06</th>    <td>151.3</td>    <td>139.3</td>  </tr>  <tr>    <th class="serie">07-06</th>    <td>153.4</td>    <td>145.3</td>  </tr>  <tr>    <th class="serie">08-06</th>    <td>152.7</td>    <td>142.9</td>  </tr>  <tr>    <th class="serie">09-06</th>    <td>152.9</td>    <td>129.2</td>  </tr>  <tr>    <th class="serie">10-06</th>    <td>152.2</td>    <td>126.0</td>  </tr>  <tr>    <th class="serie">11-06</th>    <td>151.9</td>    <td>124.8</td>  </tr>  <tr>    <th class="serie">12-06</th>    <td>150.1</td>    <td>125.9</td>  </tr>  <tr>    <th class="serie">01-07</th>    <td>148.2</td>    <td>118.9</td>  </tr>  <tr>    <th class="serie">02-07</th>    <td>145.3</td>    <td>122.9</td>  </tr>  <tr>    <th class="serie">03-07</th>    <td>142.9</td>    <td>127.7</td>  </tr>  <tr>    <th class="serie">04-07</th>    <td>142.6</td>    <td>134.4</td>  </tr>  <tr>    <th class="serie">05-07</th>    <td>144.0</td>    <td>138.5</td>  </tr>  <tr>    <th class="serie">06-07</th>    <td>145.5</td>    <td>138.7</td>  </tr>  <tr>    <th class="serie">07-07</th>    <td>147.2</td>    <td>141.8</td>  </tr>  <tr>    <th class="serie">08-07</th>    <td>150.0</td>    <td>139.2</td>  </tr>  <tr>    <th class="serie">09-07</th>    <td>153.8</td>    <td>145.6</td>  </tr>  <tr>    <th class="serie">10-07</th>    <td>155.4</td>    <td>147.6</td>  </tr>  <tr>    <th class="serie">11-07</th>    <td>157.0</td>    <td>157.9</td>  </tr>  <tr>    <th class="serie">12-07</th>    <td>158.4</td>    <td>156.2</td>  </tr>  <tr>    <th class="serie">01-08</th>    <td>162.8</td>    <td>153.9</td>  </tr>  <tr>    <th class="serie">02-08</th>    <td>162.8</td>    <td>158.6</td>  </tr>  <tr>    <th class="serie">03-08</th>    <td>164.7</td>    <td>166.3</td>  </tr>  <tr>    <th class="serie">04-08</th>    <td>168.5</td>    <td>165.8</td>  </tr></tbody></table></div></body></html>  
 |