HighCharts设置图表背景透明
其实就一句话:
backgroundColor: 'rgba(0,0,0,0)'
完整示例:
$(function () {
$('#container').highcharts({
chart: {
type: 'column',
backgroundColor: 'rgba(0,0,0,0)'
},
title: {
text: 'Stacked column chart'
},
xAxis: {
categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
},
yAxis: {
min: 0,
title: {
text: 'Total fruit consumption'
},
stackLabels: {
enabled: true,
style: {
fontWeight: 'bold',
color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
}
}
},
legend: {
align: 'right',
x: -70,
verticalAlign: 'top',
y: 20,
floating: true,
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColorSolid) || 'white',
borderColor: '#CCC',
borderWidth: 1,
shadow: false
},
tooltip: {
formatter: function() {
return '<b>'+ this.x +'</b><br/>'+
this.series.name +': '+ this.y +'<br/>'+
'Total: '+ this.point.stackTotal;
}
},
plotOptions: {
column: {
stacking: 'normal',
dataLabels: {
enabled: true,
color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white'
}
}
},
series: [{
name: 'John',
data: [5, 3, 4, 7, 2]
}, {
name: 'Jane',
data: [2, 2, 3, 2, 1]
}, {
name: 'Joe',
data: [3, 4, 4, 2, 5]
}]
});
});
还有另外一个属性,plotBackgroundColor: null
这个属性的意思是指图表部分,不含标题、说明信息,x轴y轴上的提示信息等部分的背景色,例如:
HighCharts设置图表背景透明的更多相关文章
- 设置UITableView背景透明/监听cell左边的删除按钮的点击事件
_tableView = [[UITableView alloc] init]; _tableView.delegate = self; _tableView.dataSource = self; _ ...
- 设置div背景透明的两种方法
实现div背景透明的两种方法 1.使用opacity属性 background-color:#000; opacity: 0.5; 这样做可以设置div内部所以区域的透明度,但是也会影响里面的文字,效 ...
- 设置div背景透明的CSS样式
div背景透明样式: 样式代码: .alert{filter:alpha(opacity=100); /* IE */ -moz-opacity:1.0; /* Moz + FF */ opacity ...
- Android 设置按钮背景透明与半透明_图片背景透明
Button或者ImageButton的背景设为透明或者半透明 半透明<Button android:background="#e0000000" ... /> 透明 ...
- 使用rgba设置输入框背景透明
项目中遇到要求输入框的背景设置透明度,但文字不受影响,如下图 输入框使用input标签 <input ref="searchText" type="search&q ...
- Duilib + wke 设置wke背景透明
WkeWebKit.cpp 新增 wkeSetTransparent(m_pWebView, true); void CWkeWebkitUI::DoInit() { CControlUI::DoIn ...
- Android 代码设置Activity 背景透明
当指定Activity 样式 Them.Dialog 时候 又不同意用XML 设置 Activity 的背景颜色的时候 用代码 this.getWindow().getDecorView().setB ...
- 设置groupBox背景透明
步骤:属性-BackColor-WEB面板-Transparent
- 设置iframe背景透明
<iframe allowtransparency="true" src="page.htm" frameborder="0" > ...
随机推荐
- MongoDb GridFS的使用
MongoDb GridFS 是MongoDB的文件存储方案,主要用于存储和恢复那些超过16M(BSON文件限制)的文件(如:图片.音频等),对大文件有着更好的性能. 要在C#中使用GridFS,首先 ...
- How to convert a byte to its binary string representation
How to convert a byte to its binary string representation For example, the bits in a byte B are 1000 ...
- 在ASP.NET MVC下实现单个图片上传, 客户端服务端双重限制图片大小和格式, 服务端裁剪图片
在"MVC文件图片ajax上传轻量级解决方案,使用客户端JSAjaxFileUploader插件01-单文件上传"一文中,使用JSAjaxFileUploader这款插件实现了单文 ...
- ECShop 调用自定义广告
原文地址:http://www.ecshoptemplate.com/article-1348.html ECShop中关于广告的调用方法,网上有很多,现在要介绍的不同于其他,根据实际情况选择使用,以 ...
- Xcode5和6共存时,如何发布应用到商店
如何你和我一样手贱安装了Xcode6,同时又需要发布应用到商店时,你会发现打好的包是通不过审核的.验证报错: unable to validate application archives of ty ...
- 网易游戏2015年暑期实习生面试经历-游戏研发project师
首先,我还是先介绍一下网易游戏吧.引用别人的一段话 作者:王选易.出处: http://www.cnblogs.com/neverdie/ 欢迎转载 .也请保留这段声明.假设你喜欢这篇文章,请点[推荐 ...
- Android之循环显示图像的Android Gallery组件
转自:http://www.blogjava.net/nokiaguy/archive/2010/08/23/329721.html Gallery组件主要用于横向显示图像列表,不过按常规做法.Gal ...
- ExtJS 4.2 教程-06:服务器代理(proxy)
转载自起飞网,原文地址:http://www.qeefee.com/extjs-course-6-server-proxy ExtJS 4.2 教程-01:Hello ExtJS ExtJS 4.2 ...
- 3分钟搞定SpringBoot+Mybatis+druid多数据源和分布式事务
文章来自: https://blog.csdn.net/qq_29242877/article/details/79033287 在一些复杂的应用开发中,一个应用可能会涉及到连接多个数据源,所谓多数据 ...
- sql server获取标识,获取最后ID IDENT_CURRENT、IDENTITY、SCOPE_IDENTITY区别
概念解释 IDENT_CURRENT returns the last identity value generated for a specific table in any session and ...