统计图

LWAZL1314

于 2012-03-16 17:11:23 发布

阅读量141

点赞数

分类专栏： J2EE 文章标签： web jquery ViewUI

本文链接：https://blog.csdn.net/LWAZL1314/article/details/84169914

版权

J2EE 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

好久没发表过什么东西了，今天下午闲的实在是蛋疼，没事做！！！所以才想起来，跟大家分享下。

由于自己是实习生，有好多的东西都不懂，进公司也不久，就在最近遇到统计图，可能到同事们写的代码很少很少，但是我就是看不懂是怎么搞定的，今天终于在网上查到答案，并消化的差不多了！！！下面我给大家分享下统计图源码（里面的数据都是死数据）：希望能给向我一样的菜鸟一点帮助
<HTML>
<HEAD>


<script type="text/javascript" src="javascript/jquery-1.6.3.min.js"></script>

<script type="text/javascript" src="javascript/highcharts.js"></script>

<script type="text/javascript" src="javascript/exporting.js"></script>

<script type="text/javascript">

<script type="text/javascript">

Highcharts.setOptions({
colors: ['#D9A63D', '#6ACD4C', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#FFF263', '#6AF9C4']
});

var chart;
$(document).ready(function() {
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',//"rederTo"图表的页面显示容器container
defaultSeriesType: 'column',//图表类别（类型），可取值有：line、spline、area、areaspline、bar、column,pie,scatter等
marginRight: 130,//上下左右空隙
marginBottom: 25//上下左右空隙
},

title : {

text : '全国各大城市季节情况',//”text“坐标名称
x : -20
//center

},

subtitle : {

text : '主要城市温度比较',
x : -20

},

xAxis : {
categories : [ '一月', '二月', '三月', '四月',
'五月', '六月', '七月', '八月', '九月',
'十月', '十一月', '十二月' ]

},

yAxis : {

title : {
text : '温度 (°C)'

},

plotLines : [ {

value : 0,
width : 1,
color : '#808080'
} ]
},

tooltip : {
formatter : function() {
return this.series.name+this.x+':'+this.y+'°C';

}
},

legend : {
layout : 'vertical',
align : 'right',
verticalAlign : 'top',
x : -10,
y : 100,
borderWidth : 0
},

series : [
{
name : '北京',
data : [ 7.0, 6.9, 9.5, 14.5, 18.2,
21.5, 24.8, 26.5, 23.3, 18.3,
13.9, 9.6 ]
},
{
name : '上海',
data : [ -0.2, 0.8, 5.7, 11.3, 17.0,
22.0, 24.8, 24.1, 20.1, 14.1,
8.6, 2.5 ]
},
{
name : '南昌',
data : [ -0.9, 0.6, 3.5, 8.4, 13.5,
17.0, 18.6, 17.9, 14.3, 9.0,
3.9, 1.0 ]
},
{
name : '长沙',
data : [ 3.9, 4.2, 5.7, 8.5, 11.9,
15.2, 17.0, 16.6, 14.2, 10.3,
6.6, 4.8 ]
}]
});
});
</script>

</head>
<body>


<div id="container"
style="width: 800px; height: 400px; margin: 0 auto"></div>

</body>

</html>

LWAZL1314

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
统计图

好久没发表过什么东西了，今天下午闲的实在是蛋疼，没事做！！！所以才想起来，跟大家分享下。由于自己是实习生，有好多的东西都不懂，进公司也不久，就在最近遇到统计图，可能到同事们写的代码很少很少，但是我就是看不懂是怎么搞定的，今天终于在网上查到答案，并消化的差不多了！！！下面我给大家分享下统计图源码（里面的数据都是死数据）：希望能给向我一样的菜鸟一点帮助 ...
复制链接

扫一扫

专栏目录