柱状统计图表 - A8源码实例

基本信息

源码名称：柱状统计图表

源码大小：0.08M

文件格式：.rar

开发语言：js

更新时间：2019-04-28

友情提示：（无需注册或充值，赞助后即可获取资源下载链接）

嘿，亲！知识可是无价之宝呢，但咱这精心整理的资料也耗费了不少心血呀。小小地破费一下，绝对物超所值哦！如有下载和支付问题，请联系我们QQ(微信同号)：813200300

本次赞助数额为： 2 元　

源码介绍

柱状统计图表

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="keywords" content="JS代码,{keyword},JS广告代码,JS特效代码" />
<meta name="description" content="" />
<title></title>
<style>
.wrapper{width:500px; height:300px; padding:20px; margin:0px auto}
</style>
<script src="js/jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="js/jquery.jqChart.min.js" type="text/javascript"></script>

<script lang="javascript" type="text/javascript">
$(document).ready(function () {
$('#jqChart').jqChart({
title: { text: '柱形图示例' },
axes: [
{
location: 'left',//y轴位置，取值：left,right
minimum: 10,//y轴刻度最小值
maximum: 100,//y轴刻度最大值
interval: 10//刻度间距
}
],
series: [
//数据1开始
{
type: 'column',//图表类型，取值：column 柱形图，line 线形图
title:'北京',//标题
data: [['一月', 70], ['二月', 40], ['三月', 55], ['四月', 50], ['五月', 60], ['六月', 40]]//数据内容，格式[[x轴标题,数值1],[x轴标题,数值2],......]
},
//数据1结束
//数据2
{
type: 'column',
title:'上海',
data: [['一月', 40], ['二月', 50], ['三月', 95], ['四月', 55], ['五月', 25], ['六月', 45]]
},
//数据2结束
//数据3
{
type: 'column',
title:'广州',
data: [['一月', 70], ['二月', 40], ['三月', 55], ['四月', 50], ['五月', 45], ['六月', 80]]
},
//数据3结束
]
});
});
</script>
</head>
<body>
<div class="wrapper">

<div>
<div id="jqChart" style="width: 500px; height: 300px;"></div>
</div>

</div>

</body>
</html>