echarts-颜色渐变
图形的颜色。 默认从全局调色盘 option.color 获取颜色
颜色可以使用 RGB 表示,比如
'rgb(128, 128, 128)',如果想要加上 alpha 通道表示不透明度,可以使用 RGBA,比如'rgba(128, 128, 128, 0.5)',也可以使用十六进制格式,比如'#ccc'。除了纯色之外颜色也支持渐变色和纹理填充// 线性渐变,前四个参数分别是 x0, y0, x2, y2, 范围从 0 - 1,相当于在图形包围盒中的百分比,如果 globalCoord 为 `true`,则该四个值是绝对的像素位置
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0, color: 'red' // 0% 处的颜色
}, {
offset: 1, color: 'blue' // 100% 处的颜色
}],
globalCoord: false // 缺省为 false
}
// 径向渐变,前三个参数分别是圆心 x, y 和半径,取值同线性渐变
color: {
type: 'radial',
x: 0.5,
y: 0.5,
r: 0.5,
colorStops: [{
offset: 0, color: 'red' // 0% 处的颜色
}, {
offset: 1, color: 'blue' // 100% 处的颜色
}],
globalCoord: false // 缺省为 false
}
// 纹理填充
color: {
image: imageDom, // 支持为 HTMLImageElement, HTMLCanvasElement,不支持路径字符串
repeat: 'repeat' // 是否平铺, 可以是 'repeat-x', 'repeat-y', 'no-repeat'
}
支持使用回调函数。回调函数格式如下:
(params: Object) => Color
传入的是数据项 seriesIndex, dataIndex, data, value 等各个参数。
echarts-颜色渐变的更多相关文章
- iOS 动画绘制线条颜色渐变的折线图
效果图 .................... 概述 现状 折线图的应用比较广泛,为了增强用户体验,很多应用中都嵌入了折线图.折线图可以更加直观的表示数据的变化.网络上有很多绘制折线图的demo,有 ...
- CSS3颜色渐变模式
1.线性渐变:linear-gradient 语法:<linear-gradient> = linear-gradient([ [ <angle> | to <si ...
- 【iOS实现一个颜色渐变的弧形进度条】
在Github上看到一些进度条的功能,都是通过Core Graph来实现.无所谓正确与否,但是开发效率明显就差很多了,而且运行效率还是值得考究的.其实使用苹果提供的Core Animation能够非常 ...
- IOS导航栏颜色渐变与常用属性
(转:http://www.cnblogs.com/Lingchen-start/archive/2015/10/23/4904361.html) 今年很忙,忙的写日志的时间都很少. 少的可怜. 自 ...
- css3的背景颜色渐变@线性渐变
背景颜色渐变之线性渐变 语法形式: firefox浏览器 background:-moz-linear-gradient(position/deg,startColor,endColor); oper ...
- 颜色渐变的JS代码
今天做组织机构,要分级别显示颜色,自己计算半天也没算出颜色渐变的方法,出来总是花里胡哨的难看的不要不要的,所以查了一下,找到一个js代码,试了试,很完美哦! <!DOCTYPE html> ...
- android Button 切换背景,实现动态按钮和按钮颜色渐变
android Button 切换背景,实现动态按钮和按钮颜色渐变 一.添加android 背景筛选器selector实现按钮背景改变 1.右键单击项目->new->Oth ...
- iOS 之使用CAShapeLayer中的CAGradientLayer实现圆环的颜色渐变
本文转载自:http://blog.csdn.net/zhoutao198712/article/details/20864143 在 Github上看到一些进度条的功能,都是通过Core Graph ...
- 自定义控件之圆形颜色渐变进度条--SweepGradient
前几天在群里面有人找圆形可颜色渐变进度条,其中主要的知识点是SweepGradient: mSweepGradient = new SweepGradient(240, 360, new int[] ...
- css颜色渐变在不同浏览器的设置
在web开发中,难免会遇到浏览器之间的兼容问题,关于Css设置颜色渐变下面有解决的办法,直接上代码: 适用于谷歌浏览器: background: -webkit-gradient(linear, 0 ...
随机推荐
- dos命令及github介绍
dos命令:(不区分大小写)(尽量不要用汉字) 1.打开终端的快捷方式: window+r 输入cmd 或点击 开始栏 输入cmd 2.终端的目录:c盘默认 user/administator: 想在 ...
- 云端搭建内网局域网+NAT冗余上网:vps-centos6.10 +pptp client +2个ros 实现默认走pptp上网,万一pptp断了,走另外一个ros路由+centos7补充了下
介绍下环境: 1.ROS1也是PPTP SERVER,IP为172.16.22.3/24,pptp pool为172.16.23.0/24,pptp的默认帐号是111,密码是123 2.ROS2的IP ...
- centos6.8下l2tp客户端xl2tpd的安装配置
环境: DigitalOcean centos6.8作为l2tp客户端 ros6.43.8作为l2tp服务端 1.安装xl2tp和ppp rpm -ivh http://mirrors.yun-idc ...
- IP网络设计
一.总体规划 网络设计的分层思想 按照网络设计的分层思想,通常将网络分为:核心层.汇聚层和接入层三个部分.这三部分在功能上有明显差别 ,因此在IP设计上,有必要对这三个部分区别对待. 二.核心层 核心 ...
- vue 父组件主动获取子组件的数据和方法 子组件主动获取父组件的数据和方法
Header.vue <template> <div> <h2>我是头部组件</h2> <button @click="getParen ...
- UI 性能因素考虑
浏览器的最大并发连接数一般在4到6之间,首先了解影响加载的性能因素: (1)下载的文件太大 (2)发出的请求太多 (3)请求相应不及时 针对这些因素,一般会考虑减少请求次数: (1)对静态文件设置缓存 ...
- Unreal Engine 4 基于Kajiya-Kay的材质迭代
转自:http://www.52vr.com/article-859-1.html 在先前的文章Unreal Engine 4 —— Kajiya-Kay Shading在UE4中的实现 中过了一遍怎 ...
- Linux双网卡绑定
Linux双网卡绑定 作者:Eric 微信:loveoracle11g eth0和eth1绑定为bond0 [root@rac-node1 ~]# cat /etc/sysconfig/network ...
- WordPress版微信小程序1.5版本发布
这个周末对WordPress版微信小程序进行了小版本的升级,第一个版本做得比较粗糙,性能上也有些差.本次升级主要调整和优化功能包括: 1.在主页面,加入浮动按钮,用来打开侧滑导航菜单. 2.增加侧滑导 ...
- http协议中的一些小常识
http协议这部分的知识很重要,在面试的时候也会经常问起来. 先来看一看什么是http协议:超文本传输协议(HTTP,HyperText Transfer Protocol)是互联网上应用最为广泛的一 ...