<!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>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<title>jQuery Google Charts 1.0 - Demo Site</title>
<meta http-equiv="Content-Language" content="en-us" />
<meta name="author" content="Massimiliano Balestrieri" />
<link rel="stylesheet" type="text/css" href="../../include/css/reset.css" />
<link rel="stylesheet" type="text/css" href="../../include/css/demo.css" />
<script src="../../lib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
<!--script src="../../include/js/lib/ycodaslider-2.0.rc2/lib/jquery-easing-1.3.pack.js" type="text/javascript"></script>
<script src="../../include/js/lib/ycodaslider-2.0.rc2/lib/jquery.history_remote.fixed.pack.js" type="text/javascript"></script>
<script src="../../include/js/lib/ycodaslider-2.0.rc2/lib/chili/jquery.chili-2.2.js" type="text/javascript"></script>
<script src="../../include/js/lib/ycodaslider-2.0.rc2/ycodaslider-2.0.pack.js" type="text/javascript"></script>
<script src="../../include/js/lib/ycodaslider-2.0.rc2/plugins/code-ycodaslider-2.0.pack.js" type="text/javascript"></script-->
<script src="../../include/js/lib/ycodaslider-3.0/ycodaslider-3.0.min.js" type="text/javascript"></script>
<script src="../../lib/chili/jquery.chili-2.2.js" type="text/javascript"></script>
<script src="../../lib/metadata/jquery.metadata.min.js" type="text/javascript"></script>
<script src="../../lib/janalytics/janalytics.js" type="text/javascript"></script>
<!--todo pack -->
<script src="../../jgcharts.pack.js" type="text/javascript"></script>
<script src="../../plugins/jgtable/jgtable.pack.js" type="text/javascript"></script>
<script src="../../include/js/start-1.0.js" type="text/javascript"></script>
</head>
<body>
<div id="icone_sinistra">
<!-- home -->
<a href="#" class="handle h-docs tracking {label : '/jgcharts/home'}"><img class="icone_sx" alt="docs" src="../../include/icons/home.png" /></a>
<a href="#" class="handle h-docs text_icone_sx tracking {label : '/jgcharts/home'}">Home</a>
<!-- table -->
<a href="#" class="handle h-table tracking {label : '/jgcharts/table'}"><img class="icone_sx" alt="table" src="../../include/icons/frame.png" /></a>
<a href="#" class="handle h-table text_icone_sx tracking {label : '/jgcharts/table'}">Table</a>
<!-- gui -->
<a href="../gui/" class="blank tracking {label : '/jgcharts/jggui'}"><img class="icone_sx" alt="gui" src="../../include/icons/important.png" /></a>
<a href="../gui/" class="blank text_icone_sx tracking {label : '/jgcharts/jggui'}">Gui *ALPHA</a>
</div>
<div id="icone_destra">
<!-- docs -->
<a href="#" class="handle h-docs tracking {label : '/jgcharts/docs'}"><img class="icone_sx" alt="docs" src="../../include/icons/abc.png" /></a>
<a href="#" class="handle h-docs text_icone_sx tracking {label : '/jgcharts/docs'}">Docs</a>
<!-- code -->
<a href="#" class="handle h-code tracking {label : '/jgcharts/code'}"><img class="icone_sx" alt="docs" src="../../include/icons/code.png" /></a>
<a href="#" class="handle h-code text_icone_sx tracking {label : '/jgcharts/code'}">Code</a>
<!-- download -->
<a href="../../jgcharts-0.96.zip" class="tracking {label : '/jgcharts/download'}"><img class="icone_sx" alt="Download" src="../../include/icons/download.png" /></a>
<a href="../../jgcharts-0.96.zip" class="text_icone_sx tracking {label : '/jgcharts/download'}">Download</a>
</div>
<div id="yslider-docs" class="ycodaslider">
<div class="yslider-panelwrapper" title="jGCharts 1.0">
<h3>jQuery Google Charts 1.0</h3>
<p>
Copyright (c) 2008 Massimiliano Balestrieri<br />
Examples and docs at: http://maxb.net/blog/<br />
Licensed GPL licenses:<br />
http://www.gnu.org/licenses/gpl.html<br />
</p>
<blockquote>
<p>
</p>
</blockquote>
<p>
</p>
<h4>Basic usage:</h4>
<div class="code javascript"><!--var api = new jGCharts.Api();
jQuery('<img>')
.attr('src', api.make({data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]]}))
.appendTo("#bar1");--></div>
<h4>Html:</h4>
<div class="code html"><!--<div id="bar1"></div>--></div>
<h4>Basic scripts (use packed version in production):</h4>
<div class="code html"><!--<script src="jquery-1.3.1.min.js" type="text/javascript"></script>
<script src="jgcharts.js" type="text/javascript"></script>--></div>
</div>
<!-- panel -->
<div class="yslider-panelwrapper" title="Bar">
<h4>Basic Bar</h4>
<div class="code javascript"><!--//1 ) api
var api = new jGCharts.Api();
//2) options
var opt = {
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]]//mandatory
};//set options
//3) append Img (with jQuery)
jQuery('<img>')
.attr('src', api.make(opt))//options
.appendTo("#bar1");--></div>
<div id="bar1"></div>
</div>
<!-- bar options -->
<div class="yslider-panelwrapper" title="Bar Options">
<h4>Schema</h4>
<div class="code javascript"><!--//1 ) api
var api = new jGCharts.Api();
//2) options
var opt = {};//set options
//3) append img
jQuery('<img>')
.attr('src', api.make(opt))//options
.appendTo("#chart_container");
--></div>
<h3>Options</h3>
<h4>Chart Dimension</h4>
<div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory
size : '400x400'//default 300x200 (width x height) - maximum size 300,000 pixels
}--></div>
<div id="bar2"></div>
<h4>Direction</h4>
<div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory
type : 'bhg'//default bvg
}--></div>
<div id="bar3"></div>
<h4>Legend and axis labels</h4>
<div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory
axis_labels : ['2008','2007','2006'], //default 0,1,2 etc...
legend : ['serie1', 'serie2', 'serie3'] //default none
}--></div>
<div id="bar4"></div>
<h4>Dimensions and spacing</h4>
<div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory
bar_width : 10, //default 20
bar_spacing : 10 //default 1
}--></div>
<div id="bar5"></div>
<h4>Colors</h4>
<div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory
colors : ['4b9b41','81419b','41599b']
}--></div>
<div id="bar6"></div>
<h4>Background - solid</h4>
<div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory
bg : 'e0e0e0'//default false
//bg_trasparency : 50 - default false - also chbg_trasparency
}--></div>
<div id="bar7"></div>
<h4>Background - gradient</h4>
<div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory
bg : 'FFFFFF',//default false
bg_offset : '000000',
bg_angle : '45',//default 90
bg_type : 'gradient' //default solid
}--></div>
<div id="bar8"></div>
<h4>Background - stripes</h4>
<div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory
bg : 'FFFFFF',//default false
bg_offset : 'e0e0e0',
bg_angle : '0',//default 90
bg_type : 'stripes', //default solid
bg_width : '10'//default 10 - min 10
}--></div>
<div id="bar9"></div>
<h4>Chart Area Background (like bg)</h4>
<div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80,
JSCharts3_demo
4星 · 超过85%的资源 需积分: 9 98 浏览量
2011-09-27
14:53:28
上传
评论
收藏 315KB ZIP 举报 
JSCharts3_demo （132个子文件） 
_x_. 2KB jquery-ui-themeroller.css 25KB jggui.css 4KB ycodaslider-3.0.css 3KB _top.css 928B reset.css 768B reset.css 751B demo.css 741B farbtastic.css 731B _id.css 51B
loading.gif 16KB beta.gif 2KB frame.gif 2KB abc.gif 2KB home.gif 1KB code.gif 1KB important.gif 1KB download.gif 1KB right.gif 1KB left.gif 1021B colorpicker_select.gif 78B colorpicker_select.gif 78B 222222_35x9_colorpicker_indicator.gif.gif 70B 00498f_11x11_icon_doc.gif 64B 000000_11x11_icon_doc.gif 64B 222222_11x11_icon_doc.gif 64B 00498f_11x11_icon_close.gif 62B 000000_11x11_icon_close.gif 62B 000000_11x11_icon_folder_open.gif 61B 222222_11x11_icon_resize_se.gif 61B 00498f_11x11_icon_folder_closed.gif 61B 00498f_11x11_icon_plus.gif 61B 222222_11x11_icon_plus.gif 61B 000000_11x11_icon_plus.gif 61B 00498f_11x11_icon_folder_open.gif 61B 000000_11x11_icon_folder_closed.gif 61B 222222_11x11_icon_arrows_leftright.gif 58B 000000_11x11_icon_arrows_leftright.gif 58B 00498f_11x11_icon_arrows_leftright.gif 58B 222222_11x11_icon_arrows_updown.gif 56B 00498f_11x11_icon_arrows_updown.gif 56B 222222_11x11_icon_minus.gif 56B 000000_11x11_icon_arrows_updown.gif 56B 00498f_11x11_icon_minus.gif 56B 000000_11x11_icon_minus.gif 56B 00498f_7x7_arrow_right.gif 53B 222222_7x7_arrow_left.gif 53B 00498f_7x7_arrow_left.gif 53B 222222_7x7_arrow_right.gif 53B 000000_7x7_arrow_left.gif 53B 000000_7x7_arrow_right.gif 53B 000000_7x7_arrow_up.gif 52B 00498f_7x7_arrow_up.gif 52B 222222_7x7_arrow_up.gif 52B 00498f_7x7_arrow_down.gif 52B 222222_7x7_arrow_down.gif 52B 000000_7x7_arrow_down.gif 52B icon_color_arrow.gif 46B grey.gif 43B
index.html 54KB index.html 15KB index.html 11KB dashboard.html 10KB jggui.html 10KB custom.html 9KB jquery-1.3.2.min.js 56KB jquery-1.2.6.min.js 54KB jquery-1.2.6.min.js 54KB jquery-1.3.1.min.js 54KB jquery-ui-personalized-1.6rc2.min.js 49KB php-f.js 39KB jquery-ui-personalized-1.6rc6.min.js 34KB start-1.0.js 28KB jgcharts.js 24KB jggui.js 24KB jquery.chili-2.2.js 20KB recipes.js 18KB ycodaslider-3.0.js 15KB ycodaslider-3.0.min.js 9KB farbtastic.js 9KB css.js 8KB mysql.js 7KB php.js 7KB jgcharts.pack.js 6KB ycodaslider-3.0.pack.js 6KB lotusscript.js 5KB jquery.metadata.js 4KB jquery.metadata.js 4KB cplusplus.js 3KB jgtable.js 3KB html.js 3KB janalytics.js 3KB js.js 2KB javascript.js 2KB delphi.js 2KB csharp.js 2KB jgtable.pack.js 1KB java.js 1KB janalytics.pack.js 1KB jquery.metadata.pack.js 1KB共 132 条
- 1
- 2
资源评论
yangqiang8703072012-08-06还行，不过不够详细。。。
