今天要给大家介绍的是运用JSCharts来实现web页面的统计图绘制。
大家先来看一个最简单的例子，直接上代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!-- 加上下面这句可以让浏览器不再询问是否加载ActiveX -->
<!-- saved from url=(0065)http://oa.cfsc.cn:8003/FlowEngineWeb/workflow/FlowList_huaxin.jsp -->
<html>
<head>
<!-- 下面这句必须有，否则在new JSChart时会出现找不到JSChart等错 -->
<metahttp-equiv="content-type"content="text/html;charset=utf-8">
<title>JSChart Test</title>
<!-- 导入js控件，免费的jscharts.js是带有JSChart水印的 -->
<scripttype="text/javascript"src="jscharts_mb.js"></script>
</head>
<body>
<!-- 展示图表的层 -->
<divid="graph">JSCharts...</div>
<scripttype="text/javascript">
// 定义一个Array数组
var myData = new Array([10, 20], [15, 10], [20, 30], [25, 10], [30, 5]);
//定义一个JSChart,graph是展示图表的层，line是展示类型：线形，还可以是饼图、柱状图
var myChart = new JSChart('graph','line');
//将数组信息注入mychart
myChart.setDataArray(myData);
//绘图
myChart.draw();
</script>
</body>
</html>
效果图如下：
以上为通过Array数组的方式注入信息，还可以通过xml或者json的方式来注入数据
JSCharts还能绘制饼图和柱形图，大家可以去参照官网说明文档
最后公布本控件下载地址：http://www.jscharts.com/
模版图形使用实例http://www.jscharts.com/how-to-use-bar-charts
此网站还可以在网站中编辑好你所需要的样式，然后再下载相关调用代码编辑地址为：http://www.jscharts.com/template
官网使用实例，但很多实例都需要在<head>标签中手动添加如下语句，否则无法正常运行：<meta http-equiv="content-type" content="text/html;charset=utf-8">
免费版本水印去除
搜索 gy=1a.gz 前面加 gx="<"; 图标标题是 chart.setTitle('**********')
js charts 3版本中，搜索一下关键字 fs.bg.2v(fX)直接删除即可
