颜色渐变的RGB计算
均匀渐变
渐变(Gradient)是美学中一条重要的形式美法则,与其相对应的是突变。形状、大小、位置、方向、色彩等视觉因素都可以进行渐变。在色彩中,色相、明度、纯度也都可以产生渐变效果,并会表现出具有丰富层次的美感。本文主要讲述两种颜色RGB数值的渐变算法。
已知:A=50,B=200,A、B之间平均分成3份(Step=3),求每份的数值(StepN)分别是多少。
公式:Gradient = A + (B-A) / Step * N
[注]:编程时为了提高效率避免浮点运算,往往把除法放在最后面,这样公式就成了:Gradient = A + (B-A) * N / Step
Step=3时,根据公式可以求出Step1=A+(A-B)/3*1=50+(200-50)/3=100,Step2=A+(A-B)/3*2=50+(200-50)/3*2=150。这就是均匀渐变的算法原理了,很简单,小学知识。
两种颜色的渐变就是对两种颜色的RGB通道分别进行这样的计算,例如两种颜色分别是RGB(200,50,0)和RGB(50,200,0),用上述公式进行计算就是:
RStep1=RA=RA+(BA-RA)/Step*N=200+(50-200)/3*1=200-50=150
GStep1=GA=GA+(GA-GA)/Step*N=50+(200-50)/3*1=50+50=100
BStep1=BA=BA+(BA-BA)/Step*N=0
因此RGBStep1=(150,100,0),同样的方法可以求出RGBStep2=(100,150,0)。
颜色渐变的RGB计算的更多相关文章
- JS 处理十六进制颜色渐变算法-输入颜色,输出渐变rgb数组
html颜色有几种表示方式: 英文单词颜色值:background-color:Blue:十六进制颜色值:background-color:#FFFFFF: RGB颜色值三元数字:backgroun ...
- 颜色渐变的JS代码
今天做组织机构,要分级别显示颜色,自己计算半天也没算出颜色渐变的方法,出来总是花里胡哨的难看的不要不要的,所以查了一下,找到一个js代码,试了试,很完美哦! <!DOCTYPE html> ...
- javascript实现颜色渐变
渐变(Gradient)是美学中一条重要的形式美法则,与其相对应的是突变.形状.大小.位置.方向.色彩等视觉因素都可以进行渐变.在色彩中,色相.明度.纯度也都可以产生渐变效果,并会表现出具有丰富层次的 ...
- WPF在3D Cad模型中利用TextureCoordinates实现颜色渐变显示偏差值的变化
原文:WPF在3D Cad模型中利用TextureCoordinates实现颜色渐变显示偏差值的变化 注:最近在做3D机械模型重建方面的软件,需要根据光栅传感器采集的数据绘制3D图形,并显示出色差以及 ...
- javascript实战 : 简单的颜色渐变
HTML <div id="color"></div> CSS .item{ display:inline-block; margin:10px; widt ...
- 【.NET 与树莓派】WS28XX 灯带的颜色渐变动画
在上一篇水文中,老周演示了 WS28XX 的基本使用.在文末老周说了本篇介绍颜色渐变动画的简单实现. 在正式开始前,说一下题外话. 第一件事,最近树莓派的价格猛涨,相信有关注的朋友都知道了.所以,如果 ...
- iOS 动画绘制线条颜色渐变的折线图
效果图 .................... 概述 现状 折线图的应用比较广泛,为了增强用户体验,很多应用中都嵌入了折线图.折线图可以更加直观的表示数据的变化.网络上有很多绘制折线图的demo,有 ...
- android Button 切换背景,实现动态按钮和按钮颜色渐变
android Button 切换背景,实现动态按钮和按钮颜色渐变 一.添加android 背景筛选器selector实现按钮背景改变 1.右键单击项目->new->Oth ...
- 第四界css大会 黑魔法-css网格背景、颜色拾取器、遮罩、文字颜色渐变、标题溢出渐变等
1.css网格背景 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
随机推荐
- php模拟POST请求提交数据
php模拟POST请求提交数据 1.基于fsockopen function phppost00($jsonString){ $URL='https://www.jy.com/phppostok.ph ...
- PYTHON开发--面向对象基础入门
面向对象 一:面向对象初级 1.思考:首先在python中,以前我们以前用到的几乎都是函数式编程,但是有时候函数式编程其中代码重复利用率太高,我们往往会把这些重复代码写进一个函数日后去调用,所以呢,今 ...
- ubuntu14.04安装wine以及国际版QQ
公社(http://www.linuxidc.com/linux/2014-06/103768.htm)说: Wine (“Wine Is Not an Emulator” 的首字母缩写)是一个能够在 ...
- 编程思想—依赖注入(DI)并非实现控制反转(IOC)的最佳方法
以构造函数注入为例: public class TestClass(IClassA a,IClassB b, IClassC C,IClassD d) { public void Method1() ...
- IE8,IE9,IE10绿色版,以及ColorPix
对于开发者而言IETest是一坨屎. 但是我们终于迎来的蛋糕和火腿,今天无意间发现了竟然有绿色版的浏览器版本,IE9,IE10已经下到本地,IE8网传是有的,但是没有找到合适的版本.但是足够了,本机使 ...
- Quartz源码阅读
基于Quartz1.8.5的源码解读 首先看一个demo //简单的任务管理类 //QuartzManager.java package quartzPackage; import java.text ...
- mmap内存映射复习
c语言初学时,比较常见的一个习题就是实现cp. 使用c库实现的cp就不赘述了. 最近工作用到内存映射,就拿来练下手,复习一下mmap的用法. 很简单,将目标文件和源文件映射到内存,然后使用memcpy ...
- Test for open live write
this is test document. this is test document. this is test document. this is test document. this is ...
- C语言 rand()函数的用法
rand()(产生随机数) 相关函数 srand() 表头文件 #include<stdlib.h> 定义函数 int rand()(void) 函数说明 rand()会返回一随机数值,范 ...
- [BZOJ 3144] [Hnoi2013] 切糕 【最小割】
题目链接:BZOJ - 3144 题目分析 题意:在 P * Q 的方格上填数字,可以填 [1, R] . 在 (x, y) 上填 z 会有 V[x][y][z] 的代价.限制:相邻两个格子填的数字的 ...