Highcharts条形与柱形同时显示
var chart;
$(function() {
chart = new Highcharts.Chart({
chart: {
renderTo: 'chart_combo' //关联页面元素div#id
},
title: { //图表标题
text: '2011年东北三大城市水果消费量统计图'
},
xAxis: { //x轴
categories: ['柑橘', '香蕉','苹果', '梨子'], //X轴类别
labels:{y:} //x轴标签位置:距X轴下方18像素
},
yAxis: { //y轴
title: {text: '消费量(万吨)'}, //y轴标题
lineWidth: //基线宽度
},
tooltip: {
formatter: function() { //格式化鼠标滑向图表数据点时显示的提示框
var s;
if (this.point.name) { // 饼状图
s = '<b>' + this.point.name + '</b>: <br>' + this.y+ '万吨(' +
twoDecimal(this.percentage) + '%)';
} else {
s = '' + this.x + ': ' + this.y + '万吨';
}
return s;
}
},
labels: { //图表标签
items: [{
html: '水果消费总量对比',
style: {
left: '48px',
top: '8px'
}
}]
},
exporting: {
enabled: false //设置导出按钮不可用
},
credits: {
text: 'helloweba.com',
href: 'http://www.helloweba.com'
},
series: [{ //数据列
type: 'column',
name: '长春',
data: [8.4, 9.8, 11.4, 15.6]
},
{
type: 'column',
name: '沈阳',
data: [9.2, 7.8, 10.2, 16.8]
},
{
type: 'column',
name: '哈尔滨',
data: [6.5, 9.4, 13.2, 18.6]
},
{
type: 'spline',
name: '平均值',
data: [8.03, , 11.6, ]
},
{
type: 'pie', //饼状图
name: '水果消费总量',
data: [{
name: '长春',
y: 45.2,
color: '#4572A7'
},
{
name: '沈阳',
y: ,
color: '#AA4643'
},
{
name: '哈尔滨',
y: 47.7,
color: '#89A54E'
}],
center: [, ], //饼状图坐标
size: , //饼状图直径大小
dataLabels: {
enabled: false //不显示饼状图数据标签
}
}]
});
});
Highcharts条形与柱形同时显示的更多相关文章
- jquery自定义滚动条 鼠标移入或滚轮时显示 鼠标离开或悬停超时时隐藏
一.需求: 我需要做一个多媒体播放页面,左侧为播放列表,右侧为播放器.为了避免系统滚动条把列表和播放器隔断开,左侧列表的滚动条需要自定义,并且滚动停止和鼠标离开时要隐藏掉. 二.他山之石: 案例来自h ...
- 启动mysql时显示:/tmp/mysql.sock 不存在的解决方法
启动mysql时显示:/tmp/mysql.sock 不存在的解决方法 启动mysql时报错的解决(mysql 5.0.45 redhat as 43) ====================== ...
- JS实现类似QQ好友头像hover时显示资料卡的效果
一.应用场景 鼠标hover弹出div,并且鼠标离开后不能马上隐藏,因为这个div上还有功能入口.比如: 鼠标经过好友列表中的好友头像时显示资料卡的效果 hover时显示二维码 二.实现 用如下这样一 ...
- vue隐藏APP启动时显示的{{}}
vue隐藏APP启动时显示的{{}} vue组件在编译好之前会显示{{msg}},在官网上找到这个
- Ouibounce – 在用户离开你网站时显示模态弹窗
Ouibounce 是一个微小的库,用于实现在用户离开你的网站的时候显示一个模式窗口.这个库可以帮助你增加着陆页的转换率. Ouibounce 会在当鼠标光标移动到接近(或通过)视口(viewport ...
- 看代码学知识之(2) ListView无数据时显示其他View
看代码学知识之(2) ListView无数据时显示其他View 今天看的一块布局是这样的: <!-- The frame layout is here since we will be show ...
- telnet时显示:允许更多到 telnet 服务器的连接。请稍候再试
telnet时显示:允许更多到 telnet 服务器的连接.请稍候再试 解决办法: windows自带telnet服务器默认的最大连接数为2,要想修改该设置,可以在命令行键入tlntadmn c ...
- ios8 tableView设置滑动删除时 显示多个按钮
** * tableView:editActionsForRowAtIndexPath: //设置滑动删除时显示多个按钮 * UITableViewRowAction ...
- 实现easyui datagrid在没有数据时显示相关提示内容
本示例实现easyui datagrid加载/查询数据时,如果没有相关记录,则在datagrid中显示没有相关记录的提示信息,效果如下图所示 本实例要实现如下图所示的效果: 本示例easyui版本为1 ...
随机推荐
- 3. Android框架和工具之 xUtils(ViewUtils )
1. ViewUtils 作用: 完全注解方式就可以进行UI绑定和事件绑定. 无需findViewById和setClickListener等. 2. UI绑定 和 事件绑定 (1)UI绑定 下面我們 ...
- CentOS 7 使用外部邮箱 发送邮件和附件—mail,mailx
1.查看软件包是否安装 [root@localhost ~]# rpm -qa|grep mail mailx-12.5-12.el7_0.x86_64 javamail-1.4.6-8.el7.no ...
- Terminate program hitting CTRl+C within GDB
Q: My program is determined to stop its execution by hitting CTRL+C in command window. By now, i hav ...
- Oracle数据库作业-5 查询
14.查询所有学生的Sname.Cno和Degree列. select t.sname,c.cno,c.degree from student t inner join score c on t.sn ...
- 手机app(功能)测试重点
在手机客户端进行查看的测试重点:1.“点击加载更多”的分页处理技术,是否有重复的数据,数据显示是否完整,到达最后一页后是否还有数据进行显示2.数据的排序方式2.界面跳转是否正确3.出现异常情况是否有提 ...
- 开启Microsoft SQL Management时,如果出现"未能加载包
Ms Sql server 2005在开启Microsoft SQL Management时,如果出现"未能加载包“Microsoft SQL Management Studio Packa ...
- 瀑布流布局--jQuery写法
HTML <div id="main"> <div class="box"> <div class="pic" ...
- 通过Scrapy抓取QQ空间
毕业设计题目就是用Scrapy抓取QQ空间的数据,最近毕业设计弄完了,来总结以下: 首先是模拟登录的问题: 由于Tencent对模拟登录比较讨厌,各个防备,而本人能力有限,所以做的最简单的,手动登录后 ...
- ASP.NET,web.config 中SessionState的配置
web Form 网页是基于HTTP的,它们没有状态, 这意味着它们不知道所有的请求是否来自同一台客户端计算机,网页是受到了破坏,以及是否得到了刷新,这样就可能造成信息的丢失. 于是, 状态管理就成了 ...
- Sass之初识
Sass is the most mature, stable, and powerful professional grade CSS extension language in the world ...