Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >YIQ颜色空间_简述RGB颜色

YIQ颜色空间_简述RGB颜色

作者头像
全栈程序员站长
发布于 2022-11-17 08:27:57
发布于 2022-11-17 08:27:57
2.9K00
代码可运行
举报
运行总次数:0
代码可运行

首先,我们先来了解下有关颜色的基本概念

一、色彩的基本概念

1、彩色的三要素 亮度:即人眼对光的明亮程度的感受。 色调:人眼能看到的颜色种类,与光的波长有关 饱和度:颜色深浅程度。与各种颜色混入白光的比例有关。 以上 色调 + 饱和度 = 色度

2、三基色原理 三基色可以通过适当比例的混合组成自然界中任何一种颜色

由于人眼对于红绿蓝三种色光最为敏感,并且由这三种颜色能组成的颜色范围最广,故一般选用RGB作为三基色

但是,三基色并不是唯一的,只要满足任何一种颜色都不能由其他两种颜色合成即可组成三基色。例如,我们还可以用黄色,品红,青色组成三基色。

3、亮度的组成

4、常用的四种颜色空间

  • A、RGB颜色空间 RGB彩色空间利用相加混合法将三个彩色分量按照不同的比例叠加,最终就可以在屏幕中显现出各种颜色。

任意的彩色光F都有一个配色的公式:F = r[R]+g[G]+b[B] 式中r,g,b为系数,r+g+b=1。故,知其二便可唯一确定色调。

  • B、YUV颜色空间 研究表面,人眼对于亮度的敏感度远大于对于颜色细节的敏感度,因此,才彩色电视机系统中不采用RGB颜色空间,一般为以下的空间:

采用YUV颜色空间的好处有:

a、解决了彩色电视机和黑白电视机的兼容问题(因为黑白电视机只需要提取信号中的Y信号即可显示出来)

b、可以节省传输带宽 一般情况下,数字化后的 Y:U:V = 8:4:4或者Y:U:V = 8:2:2,即亮度信号Y需要8比特表示,UV需要4个或者2个比特表示,我们知道,RGB颜色空间下,需要24比特来表示一个颜色,而利用YUV则仅需要16比特或者12比特,达到压缩的目的。

在PAL制下,白光亮度Y和红绿蓝三色光的关系可以用以下公式表示: Y = 0.222R + 0.707G + 0.071B 在NTSC制下,Y=0.299R+0.587G+0.114B

色差U,即蓝基色分量与亮度的差值信号,可以用以下公式表示: U = k1(B – Y) 色差V,即红基色分量与亮度的差值信号,可以用以下公式表示: V = k2(R – Y) 通常,k1 = 0.493,k2 = 0.877

YUV颜色空间与RGB颜色空间的转换

  • C、YIQ颜色空间

如上图所示,YIQ颜色空间被NTSC制的彩色电视机使用。 其中Y还是亮度信号,用👇公式表示: Y = 0.299R + 0.587G + 0.114B

I代表人眼敏感的色彩色差信号,用👇公式表示: I = 0.596R – 0.275G – 0.321B’

Q代表人眼不敏感的色差信号,用👇公式表示: Q = 0.212R – 0.523G + 0.311B

  • D、HSI颜色空间(HSI) 色调H,饱和度为S,光强为V

上图为博客:https://www.cnblogs.com/faith0217/articles/4264652.html 中的内容

二、编程实现提取图像中一点的RGB颜色值,并实现RGB转换为YUV,YIQ,HIS。

以下程序利用python实现

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
import math
import numpy as np
from PIL import Image

imgpath = 'C:/Users/11037/Desktop/7.jpg'  #图片路径

m_yuv = np.mat([[0.299,0.587,0.114],[-0.299,-0.587,0.886],[0.701,-0.587,-0.114]])
m_yiq = np.mat([[0.299,0.587,0.114],[0.596,-0.274,-0.322],[0.211,-0.524,0.312]])

def rgb2yuv(need_rgb):
	ans = list([int(i) for i in m_yuv*need_rgb])
	return ans

def yuv2rgb(need_yuv):
	m = m_yuv.I
	ans = list([int(i) for i in m*need_yuv])
	return ans

def rgb2yiq(need_rgb):
	ans = list([int(i) for i in m_yiq*need_rgb])
	return ans

def yiq2rgb(need_yiq):
	m = m_yiq.I
	ans = list([int(i) for i in m*need_yiq])
	return ans

'''
def rgb2hsi(need_rgb:np.mat): 
	rgb = list(need_rgb)
	r,g,b = int(rgb[0]),int(rgb[1]),int(rgb[2])
	theta = math.acos((((r-g)+(r-b))/2)/math.sqrt((r-g)**2+(r-b)*(g-b)))
	print('theta',theta)
	if b<=g:
		h = theta
	else:
		h = 360-theta
	s = 1-3*min(r,g,b)/(r+g+b)
	i = (r+g+b)/3
	return (h,s,i)
'''

img = Image.open(imgpath)
img = np.array(img)
print(img.shape)
x = int(input('请输入x:'))
y = int(input('请输入y:'))

testrgb = np.mat(img[x,y]).T
rgb2 = rgb2yuv(testrgb)
print('需要转换的rgb为:\n',testrgb)
print('rgb转yuv:',rgb2)
print('yuv转rgb:',yuv2rgb(np.mat(rgb2).T))

Jetbrains全家桶1年46,售后保障稳定

三、利用OpenCV转换RGB为HSV,YUV

1、代码

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
import math
import numpy as np
import cv2 as cv
import matplotlib.pyplot as plt

imgpath = '' #图片路径

img = cv.imread(imgpath)

imggray = cv.cvtColor(img,cv.COLOR_BGR2GRAY)
imghsv = cv.cvtColor(img,cv.COLOR_BGR2HSV)
imgyuv = cv.cvtColor(img,cv.COLOR_BGR2YUV)

plt.subplot(221),plt.imshow(img),plt.title('img')
plt.subplot(222),plt.imshow(imggray),plt.title('imggray')
plt.subplot(223),plt.imshow(imghsv),plt.title('imghsv')
plt.subplot(224),plt.imshow(imgyuv),plt.title('imgyuv')

plt.show()

效果:


若发现错误请给予指出,谢谢~

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/219103.html原文链接:https://javaforall.cn

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022年10月28日,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
关于Babel 6的 loose mode
loose mode 我翻译为松散模式,loose mode在babel中通常是不推荐使用的,但是我们需要知道的是使用 loose mode 转换而来的代码更加像ES5的代码(更像是人手写的)
用户1515472
2019/07/24
6790
babel到底将代码转换成什么鸟样?
前言 将babel捧作前端一个划时代的工具一定也不为过,它的出现让许多程序员幸福地用上了es6新语法。但你就这么放心地让babel跑在外网?反正我是不放心,我就曾经过被坑过,于是萌生了研究babel代
李成熙heyli
2018/01/05
2.3K0
babel到底将代码转换成什么鸟样?
移动端打印输出内容以及网络请求-vconsole.js
今天,无意间从别人那里得知一个很好的js插件--vconsole.min.js,可以实现在移动端打印输出内容以及查看网络请求。下面记录使用方式。 1、下载vconsole.min.js插件 以下复制了插件vconsole.min.js的内容 /*! * vconsole v2.5.1 (https://github.com/WechatFE/vConsole) * Copyright 2016, WechatFE Team * MIT license */ !function(e,t){"objec
用户1174387
2018/01/17
2.4K0
移动端打印输出内容以及网络请求-vconsole.js
聊一聊面试中经常被问到的Tree Shaking
天下武功,唯快不破!最新版的 antd 以及 vue 都对 Tree Shaking 提供了支持。我们内部的组件在支持这部分功能时,也专门梳理了相关的特性。这是四月份写的文章了,长时间不用就会忘,复习一下!
前端迷
2020/08/28
2.1K0
聊一聊面试中经常被问到的Tree Shaking
酷炫一款动态背景(HTML +js canvas)
                                     一款酷炫的前端动态页面     废话不多说 ,分享一款酷炫的页面动态背景 效果见下图。     查看  demo 背景图效果: 实例效果  点击效果: 背景css *{ margin: 0; padding: 0; } #canvas{ position: fixed; background: #ccc; overflow: auto;
Fivecc
2022/11/21
6.8K0
酷炫一款动态背景(HTML +js canvas)
【THE LAST TIME】一文吃透所有JS原型相关知识点
首先我想说,【THE LAST TIME】系列的的内容,向来都是包括但不限于标题的范围。
Nealyang
2019/11/04
1.1K0
JS原生方法原理探究(六)从 Babel 转译过程浅谈 ES6 实现继承的原理
都说 ES6 的 Class 是 ES5 的语法糖,那么 ES6 的 Class 是如何实现的呢?其实现继承的原理又是什么呢?不妨我们通过 Babel 转译代码的方式,看看其中有什么门道。
Chor
2021/06/08
1.2K0
ES5的继承和ES6的继承有什么区别?让Babel来告诉你
如果以前问我ES5的继承和ES6的继承有什么区别,我一定会自信的说没有区别,不过是语法糖而已,充其量也就是写法有区别,但是现在我会假装思考一下,然后说虽然只是语法糖,但也是有点小区别的,那么具体有什么区别呢,不要走开,下文更精彩!
街角小林
2022/03/21
6990
ES5的继承和ES6的继承有什么区别?让Babel来告诉你
es6转es5_es6转es5插件
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
全栈程序员站长
2022/11/09
7380
es6转es5_es6转es5插件
Babel下的ES6兼容性与规范
IMWeb前端团队
2017/12/28
2.1K0
入门babel,我们需要了解些什么
说实话,我从工作开始就一直在接触babel,然而对于babel并没有一个清晰的认识,只知道babel是用于编译javascript,让开发者能使用超前的ES6+语法进行开发。自己配置babel的时候,总是遇到很多困惑,下面我就以babel@7为例,重新简单认识下babel。
程序员白彬
2020/07/10
7540
入门babel,我们需要了解些什么
理解装饰器是怎么使用的
js 和 ts 中经常看到@+函数名的字样这个就是装饰器。它可以修饰类,类的属性,类的原型上的方法,说的简单一点它就是一个函数,可以传递参数在修饰的时候把这个类的属性传递给修饰的函数。
小丑同学
2020/09/21
6720
ES5和ES6函数你不知道的区别【面试篇】 前言1. PolyFill2.性能上3 hooks和 class 的性能4.用法上5.总结
1.利用原生 js 撸一个简单的 class; 2.根据上面的用法知道 class 必须通过 new 调用,不能直接调用;
火狼1
2020/05/09
2K0
手把手教你撸一个简易的 webpack
随着前端复杂度的不断提升,诞生出很多打包工具,比如最先的grunt,gulp。到后来的webpack和Parcel。但是目前很多脚手架工具,比如vue-cli已经帮我们集成了一些构建工具的使用。有的时候我们可能并不知道其内部的实现原理。其实了解这些工具的工作方式可以帮助我们更好理解和使用这些工具,也方便我们在项目开发中应用。
muwoo
2018/06/11
1.2K1
手把手教你撸一个简易的 webpack
ES6 + Babel + React低版本浏览器采坑记录
IMWeb前端团队
2018/01/08
1.8K0
Webpack 打包 commonjs 和 esmodule 动态引入模块的产物对比
接 Webpack 打包 commonjs 和 esmodule 模块的产物对比 我们来继续分析。这篇文章主要来看一下动态引入,允许我们引入的模块名包含变量。
windliang
2022/09/23
9500
Webpack 打包 commonjs 和 esmodule 动态引入模块的产物对比
前端模块化杂记 前言AMD/CMD简介Commonjs简介Module简介Common和Module的区别Module与webpackModule与Babel一些问题总结引用
前端模块化在近几年层出不穷,有Node的CommonJs,也有属于client端的CMD/AMD模式,而ES6本身也出现了Modules,再加上Webpack以及babel的普及,虽然在代码中经常使用到这些用法,但是如果不去深入研究,总觉得是一个黑魔法,无法探测一些问题的根源。
菜的黑人牙膏
2019/01/28
9070
webpack2 的 tree-shaking 好用吗?
下面是一个使用 react 的业务的代码依赖,但是实际上业务代码中并没有对依赖图中标识的模块,也就是说构建工具将不需要的代码打包到了最终的代码当中。显然,这是很不合理的。
IMWeb前端团队
2019/12/05
1.6K0
揭秘webpack5模块打包
​在上一节中我们初步了解了webpack可以利用内置静态模块类型(asset module type)来处理资源文件,我们所知道的本地服务,资源的压缩,代码分割,在webpack构建的工程中有一个比较显著的特征是,模块化,要么commonjs要么esModule,在开发环境我们都是基于这两种,那么通过webpack打包后,如何让其支持浏览器能正常的加载两种不同的模式呢?
Maic
2022/07/28
9640
揭秘webpack5模块打包
webpack学习笔记
原始开发模式各种js文件引入,顺序不能乱,引入的数据太大,各种js之间有关联,可以考虑所有文件复制到一个js文件里,但又有作用域问题、文件太大、可维护性差
kif
2023/02/27
2800
webpack学习笔记
推荐阅读
相关推荐
关于Babel 6的 loose mode
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验