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" > ...
随机推荐
- linux C宏定义 转
写好C语言,漂亮的宏定义很重要,使用宏定义可以防止出错,提高可移植性,可读性,方便性等等.下面列举一些成熟软件中常用得宏定义...... 1,防止一个头文件被重复包含 #ifndef COMDEF_H ...
- ACE_Message_Queue和spawn实现(生产者/消费者)(V2.00)
參考这里用到了线程管理.參考:http://blog.csdn.net/calmreason/article/details/36399697 以下的两个线程共享一个消息队列,一个用来放整数到队列,一 ...
- 关于curl: (2) Failed Initialization
一開始是由于curl无法訪问https网上说,要又一次编译安装curl 我就下载.. ./configure make make install 结果出现 curl: (2) Failed Initi ...
- webpack原理与实战
webpack是一个js打包工具,不一个完整的前端构建工具.它的流行得益于模块化和单页应用的流行.webpack提供扩展机制,在庞大的社区支持下各种场景基本它都可找到解决方案.本文的目的是教会你用we ...
- runOnUiThread更新主线程
更新UI采用Handle+Thread,需要发送消息,接受处理消息(在回调方法中处理),比较繁琐.除此之外,还可以使用runOnUiThread方法. 利用Activity.runOnUiThre ...
- java去除数组中重复的元素方法总结
/* * ArrayUnique.java * Version 1.0.0 * Created on 2017年12月16日 * Copyright ReYo.Cn */ package reyo.s ...
- “finally block does not complete normally”的警告解决
但是,java里面不是可以保证finally一定会执行的么,为什么不可以在finally块做return??? 细细看道来: debug一下这个函数,就会惊讶的发现, 里面抛出的异常会被finally ...
- mac下设置eclipse自动提示
偏好设置 -> General -> Editors -> File Associations .xml -> 设置XML Editor为default Keys 中查找 ...
- LuaJit转义的问题
之前在项目中,处理类似!30转为表现的字符串时,有人写了这样的一段代码"\![1-2][0-9]",当换成luajit时启动报错了,出错原因在于转义字符使用不对.在很多语言中,正则 ...
- md5目录下的文件包括子目录
find ./ -type f -print0 | xargs -0 md5sum