我将他分为两类，静态图表和动态图表。静态图表指图表创立的时候数据为常数。动态图表指数据为变量。运用chart.js时，首先要它需要你在网页中创建一个canvas标签来承载生成的图表（条形图，线形图，扇形图等等）。
静态图表比较简单，只需要将datasets中间的data填满想要显示的数据即可。如果想要显示不止一条线，可以加入多组dataset。
动态图表则不能直接罗列数据，因为数据的个数和值不再是常量。这时候可以选择用AJAX将数据从controller传到view。下图的callback function 指的是当你从对应的url收到数据时会调用的函数。例子如下：架设我现在想要显示一个横轴为自己定义的时间，纵轴为值的折线图，通过ajax收到的数据data是一个数组。
用数组DatasetsArray来存储数据的值，颜色，label等各种性质。在循环中遍历数组number，讲值赋予DatasetsArray的data项，并同时可以定义当前dataset的其他性质，包括label，bordercolor，是否填充颜色等等。
给dataset赋值结束后，便可以开始画图了，如下图直接将DatasetsArray赋值给datasets量即可。
在dataset后还可以加上许多其他的参数，定义图表的各个属性，如x坐标轴的字体大小，legend的名字等。
加上onclick function也是一种很实际的做法，可以让你的图表包含更多信息量且高端。比如说，你想点中图表的某个数据点然后跳转到某个页面，相当于这个点被active，则可以使用以上方法。
总之，chart.js是一个很实用易上手看起来高端的数据visulization方法。
后台获取ajax参数后，可以通过参数查询数据库，返回一个javabean对象，然后转换成json格式返回页面：ajax部分：
$(function(){
$("#userlist a").bind("click",function(){
var hol = $(this).attr("rel")
var data = "action=getlink&id="+hol
$.getJSON("server.php",data, function(json){
$("#name").html(json.name)
$("#sex").html(json.sex)
$("#tel").html(json.tel)
$("#email").html(json.email)
})
})
})
php后台处理部分：
后台server.php得到前端的Ajax请求后，通过传递的参数连接数据库并查询用户表，将相应的用户信息转换成一个数组$list，最后将数组转换成JSON数据。关于PHP与JSON的操作可以查看本站收集的文章：PHP中JSON的应用。以下是server.php的详细代码，其中数据连接部分省略：
include_once("connect.php")//连接数据库
$action=$_GET[action]
$id=intval($_GET[id])
if($action=="getlink"){
$query=mysql_query("select * from user where id=$id")
$row=mysql_fetch_array($query)
$list=array("name"=>$row[username],"sex"=>$row[sex],"tel"=>$row[tel],"email"=>$row[email])
echo json_encode($list)
}
