用jQuery实现的简单柱状统计图

　　国庆闲着没事，把最近一个小程序中用到的统计图整理成了一个小插件，功能不多，一柱状图而已。新手初次写这种东西，一切以学习为目的，高手请嘴下留情……

下面是效果图（水平有限，难看了些）：

使用方法：将jquery-1.10.2.js和leo.js两个js文件引入到你要使用的页面，然后在页面中添加以下代码：

　　<div class="container" data-option='{"data_url":"data/grid.json"}'></div>  

其中class="container" 必须有且不可修改，data-option属性可以有两种值，对应两种使用leoChart的方法：

　　第一种方法是data-option='{"data_url":"data/grid.json"}'，将要显示的数据以json格式统一放在一个json文件中，data_url就是指定该json问件的位置；

json文件的格式如下：

[
{
"question":"1.What's your name?",
"answers":[
{"answer":"leo","value":50},
{"answer":"dragon","value":80},
{"answer":"stefan","value":77},
{"answer":"demon","value":65},
{"answer":"reberkah","value":74}
]
},
{
"question":"2.How old are you?",
"answers":[
{"answer":"~10","value":13},
{"answer":"11~20","value":46},
{"answer":"21~30","value":98},
{"answer":"31~40","value":78},
{"answer":"41~","value":65}
]
},
{
"question":"3.What' your interes?",
"answers":[
{"answer":"swimming","value":45},
{"answer":"basketball","value":89},
{"answer":"baseball","value":34}
]
},
{
"question":"4.What' your job?",
"answers":[
{"answer":"teacher","value":66},
{"answer":"ITer","value":56},
{"answer":"boss","value":89}
]
}
]

第二种方法是data-option='{"data":[{"question":"name?","answers":[{"answer":"leo","value":50},{"answer":"dragon","value":68}]}]}'，直接将要显示的信息复制给data-option，数据的格式和第一种方法使用的json格式一样。

注意事项：1、json数据务必按标准照格式写，即key必须用双引号；

　　　　　2、由于安全性问题，再本地测试使用第一种方法时chrome和safari无法显示数据，移到web上就没问题了

源代码：http://pan.baidu.com/s/1qr1yV