均匀渐变

渐变(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计算的更多相关文章

  1. JS 处理十六进制颜色渐变算法-输入颜色,输出渐变rgb数组

    html颜色有几种表示方式: 英文单词颜色值:background-color:Blue:十六进制颜色值:background-color:#FFFFFF:  RGB颜色值三元数字:backgroun ...

  2. 颜色渐变的JS代码

    今天做组织机构,要分级别显示颜色,自己计算半天也没算出颜色渐变的方法,出来总是花里胡哨的难看的不要不要的,所以查了一下,找到一个js代码,试了试,很完美哦! <!DOCTYPE html> ...

  3. javascript实现颜色渐变

    渐变(Gradient)是美学中一条重要的形式美法则,与其相对应的是突变.形状.大小.位置.方向.色彩等视觉因素都可以进行渐变.在色彩中,色相.明度.纯度也都可以产生渐变效果,并会表现出具有丰富层次的 ...

  4. WPF在3D Cad模型中利用TextureCoordinates实现颜色渐变显示偏差值的变化

    原文:WPF在3D Cad模型中利用TextureCoordinates实现颜色渐变显示偏差值的变化 注:最近在做3D机械模型重建方面的软件,需要根据光栅传感器采集的数据绘制3D图形,并显示出色差以及 ...

  5. javascript实战 : 简单的颜色渐变

    HTML <div id="color"></div> CSS .item{ display:inline-block; margin:10px; widt ...

  6. 【.NET 与树莓派】WS28XX 灯带的颜色渐变动画

    在上一篇水文中,老周演示了 WS28XX 的基本使用.在文末老周说了本篇介绍颜色渐变动画的简单实现. 在正式开始前,说一下题外话. 第一件事,最近树莓派的价格猛涨,相信有关注的朋友都知道了.所以,如果 ...

  7. iOS 动画绘制线条颜色渐变的折线图

    效果图 .................... 概述 现状 折线图的应用比较广泛,为了增强用户体验,很多应用中都嵌入了折线图.折线图可以更加直观的表示数据的变化.网络上有很多绘制折线图的demo,有 ...

  8. android Button 切换背景,实现动态按钮和按钮颜色渐变

        android Button 切换背景,实现动态按钮和按钮颜色渐变 一.添加android 背景筛选器selector实现按钮背景改变     1.右键单击项目->new->Oth ...

  9. 第四界css大会 黑魔法-css网格背景、颜色拾取器、遮罩、文字颜色渐变、标题溢出渐变等

    1.css网格背景 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

随机推荐

  1. linux 查看端口号命令

    Linux下如果我们需要知道2809号端口的情况的话,我们可以这样,如下命令: $netstat -pan|grep 24800 tcp        0      0 0.0.0.0:24800   ...

  2. HTML+JS版本的俄罗斯方块

    <!doctype html><html><head></head><body> <div id="box" st ...

  3. Hbase Java API程序设计步骤

    http://www.it165.net/admin/html/201407/3390.html 步骤1:创建一个Configuration对象 包含了客户端链接Hbase服务所需的全部信息: zoo ...

  4. 在objc项目中使用常量的最佳实践

    在objc项目中使用常量的最佳实践   之前,在在objc项目中使用常量中,使用c的预处理#define来设置常量.比如,可以做个头文件,然后在需要的类文件中import,使用常量. 但这不是最佳实践 ...

  5. C语言中exit()与return的区别

    整理自exit函数和return函数 1.exit函数和return函数的主要区别是: 1)exit用于在程序运行的过程中随时结束程序,exit的参数是返回给OS的.main函数结束时也会隐式地调用e ...

  6. 如何使用 Java 构建微服务?

    [编者按]微服务背后的大理念是将大型.复杂且历时长久的应用在架构上设计为内聚的服务,这些服务能够随着时间的流逝而演化.本文主要介绍了利用 Java 生态系统构建微服务的多种方法,并分析了每种方法的利弊 ...

  7. :: error: 无法打开文件“d:\Qt\2010.05\qt\lib\qtmaind.lib”

    新建一个工程马上编译也会出现这个错误:: error: 无法打开文件“d:\Qt\2010.05\qt\lib\qtmaind.lib” vc的编译器, 而你安装的是mingw版本的qt. 工具-选项 ...

  8. HDwiki文件上传导致远程代码执行漏洞

    漏洞版本: HDwiki(2011) 漏洞描述: 互动维客开源系统(HDwiki)作为中国第一家拥有自主知识产权的中文维基(Wiki)系统,由互动在线(北京)科技有限公司于2006 年11月28日正式 ...

  9. haproxy实现mysql slave负载均衡

    简单画一个图: 一.服务器规划 192.168.116.132 (master)  -->写操作 192.168.116.129 (slave1)  -->读操作 192.168.116. ...

  10. SRM 387(1-250pt)

    DIV1 300pt 题意:有m种颜色的球若干个放在n个盒子里.每次操作可从一个盒子里拿出任意个球(不必同色),放进另一个盒子.要求终态为:1.最多有一个盒子里面装有不同色的球,该盒子成为joker ...