javascript计算渐变颜色的实例
时间:2019-04-07
本文章向大家介绍javascript计算渐变颜色的实例,主要包括javascript计算渐变颜色的实例使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
javascript计算渐变颜色的实例
有时候,一个表格或者一片区域内,需要若干同色系从浅到深的颜色,如图所示:
如果需要的颜色少,则颜色的差异较大,需要的颜色多,则颜色差异小,如下图:
这时,就用到了同色系渐变颜色的计算,算法如下:
function getItemColors (colorLevel) { var colors= []; //默认的最深颜色 var red = 134,green = 108, blue = 184; //最浅颜色是239,239,239 比如:最浅颜色的red是 239 则差值为239-134=105 var maxRed = 105,maxGreen = 131,maxBlue = 55; var level = colorLevel; while(level--) { colors.push( 'rgb('+red +','+green+','+blue+')'); red += parseInt(maxRed/colorLevel); green += parseInt(maxGreen/colorLevel); blue += parseInt(maxBlue/colorLevel); } return colors; }
如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!
- Markdown 语法和 MWeb 写作使用说明既然都整理了,捎带手把这个也整理了吧第一级标题<h1>
- 带权并查集(个人模版)
- 我的第一次Pascal程序
- Hive第二天学习内容总结Hive 第三天DDL特别注意一下,没事别删除数据DML
- Codeforces 791B Bear and Friendship Condition(DFS,有向图)
- Codeforces 791A Bear and Big Brother(暴力枚举,模拟)
- Selenium2+python自动化28-table定位
- POJ 2370 Democracy in danger(简单贪心)
- POJ 2209 The King(简单贪心)
- 使用 Vagrant 打造跨平台开发环境
- HDU 2084 数塔(简单DP入门)
- Python-解决Cx_Oracle查询时UnicodeDecodeError的问题
- “玲珑杯”ACM比赛 Round #12题解&源码
- NYOJ 题目77 开灯问题(简单模拟)
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- JDK8 LocalDateTime转换成时间戳
- Grafana创建zabbix自定义template(模板)
- 一条SQL引发的“血案”:
- Grafana安装配置Elasticsearch插件
- Elasticsearch升级踩坑记之使用snapshot备份数据
- RabbitMQ的安装及集群搭建方法
- CentOs7搭建rabbitmq集群
- Rabbitmq haproxy keepalived ACCESS_REFUSED - Login was refused using authentication mechanism PLAIN.
- IDEA maven+spring mvc简单项目
- 程序员用python给了女友一个七夕惊喜!
- 微信小程序开发实战(21):发起HTTPS请求
- 打破国外垄断,开发中国人自己的编程语言(2):使用监听器实现计算器
- 自定义你的github主页
- nginx配置ssl证书实现https
- 有意思的 Node.js 内存泄漏问题