<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>jqchart</title>
<!--制作图像必备的canvas插件 这个是将canvas标签转换为IE认识的vml-->
<!--[if IE]><script src="js/jqchart/excanvas-compressed.js" type="text/javascript" ></script><![endif]-->
<script src="js/jqchart/jquery.js" type="text/javascript"></script>
<!--jQuery图标插件-->
<script src="js/jqchart/jquery.jqchart.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
jQuery = $;
</script>
<script type="text/javascript">
jQuery(document).ready(function(){
//原始样式
var chartSetting={data : [ [435,500,600,700,888,777,925] ]};
jQuery('#canvasMyID5').jQchart(chartSetting);
//个人设置样式
var diy_chartSetting={
config : {
title : "图表说明(也就是图标的头部)",
titleLeft: 80,//图表头部说明距离画布最左端的距离
titleTop:20,//图表头部说明距离画布最上端的距离
labelX : ["X1","X2","X3","X4","X5","X6","X7"],
scaleY : {min: 0,max:1000,gap:200},
width: 680, //有影响
height: 500, //有影响
chartHeigth:450,
chartWidth:650,
paddingT : 50, //有影响
paddingR : 50, //有影响
paddingB : 50, //有影响
paddingL : 50 //有影响
},
data : [
[435,500,600,700,888,777,925],
[50,123,312,200,402,300,512],
[100,400,790,640,128,347,567]
]
};
jQuery('#canvasMyID').jQchart(diy_chartSetting);
});
</script>
</head>
<body>
<div style="text-align:center;color:red;font-weight:bold;">jqchart默认显示格式</div>
<canvas id="canvasMyID5" height="400" width="680"></canvas>
<div style="text-align:center;color:red;font-weight:bold;">jqchart自定义显示格式</div>
<canvas id="canvasMyID" height="400" width="680"></canvas>
</body>
</html>
