导航:首页 > 编程语言 > rgb模糊滤镜js算法

rgb模糊滤镜js算法

发布时间:2023-02-05 21:58:58

js 怎么实现argb和rgb的相互转换

argb比rgb多了前2位透明度
argb:#1e000000
rgb:#000000
用js 字符串截取去掉#后2位,就等于得到了rgb的值

② rgb在js中什么意思

rgb在js中意思是三原色色彩模式。根据查询相关公开信息显示:RGB色彩模式是工业界的一种颜色标准,是通过对红(R)、绿(G)、蓝(B)三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色的,RGB即是代表红、绿、蓝三个通道的颜色,这个标准几乎包括了人类视力所能感知的所有颜色,是运用最广的颜色系统之一。

③ 求js颜色转换算法

(function(d){function h(a,b,e){var c="rgb"+(d.support.rgba?"a":"")+"("+parseInt(a[0]+e*(b[0]-a[0]),10)+","+parseInt(a[1]+e*(b[1]-a[1]),10)+","+parseInt(a[2]+e*(b[2]-a[2]),10);d.support.rgba&&(c+=","+(a&&b?parseFloat(a[3]+e*(b[3]-a[3])):1));return c+")"}function f(a){var b;return(b=/#([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})/.exec(a))?[parseInt(b[1],16),parseInt(b[2],16),parseInt(b[3],16),1]:(b=/#([0-9a-fA-F])([0-9a-fA-F])([0-9a-fA-F])/.exec(a))?[17*parseInt(b[1],16),17*parseInt(b[2],
16),17*parseInt(b[3],16),1]:(b=/rgb\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\)/.exec(a))?[parseInt(b[1]),parseInt(b[2]),parseInt(b[3]),1]:(b=/rgba\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9\.]*)\s*\)/.exec(a))?[parseInt(b[1],10),parseInt(b[2],10),parseInt(b[3],10),parseFloat(b[4])]:l[a]}d.extend(!0,d,{support:{rgba:function(){var a=d("script:first"),b=a.css("color"),e=!1;if(/^rgba/.test(b))e=!0;else try{e=b!=a.css("color","rgba(0, 0, 0, 0.5)").css("color"),
a.css("color",b)}catch(c){}return e}()}});var k="color backgroundColor borderBottomColor borderLeftColor borderRightColor borderTopColor outlineColor".split(" ");d.each(k,function(a,b){d.Tween.propHooks[b]={get:function(a){return d(a.elem).css(b)},set:function(a){var c=a.elem.style,g=f(d(a.elem).css(b)),m=f(a.end);a.run=function(a){c[b]=h(g,m,a)}}}});d.Tween.propHooks.borderColor={set:function(a){var b=a.elem.style,e=[],c=k.slice(2,6);d.each(c,function(b,c){e[c]=f(d(a.elem).css(c))});var g=f(a.end);
a.run=function(a){d.each(c,function(d,c){b[c]=h(e[c],g,a)})}}};var l={aqua:[0,255,255,1],azure:[240,255,255,1],beige:[245,245,220,1],black:[0,0,0,1],blue:[0,0,255,1],brown:[165,42,42,1],cyan:[0,255,255,1],darkblue:[0,0,139,1],darkcyan:[0,139,139,1],darkgrey:[169,169,169,1],darkgreen:[0,100,0,1],darkkhaki:[189,183,107,1],darkmagenta:[139,0,139,1],darkolivegreen:[85,107,47,1],darkorange:[255,140,0,1],darkorchid:[153,50,204,1],darkred:[139,0,0,1],darksalmon:[233,150,122,1],darkviolet:[148,0,211,1],fuchsia:[255,
0,255,1],gold:[255,215,0,1],green:[0,128,0,1],indigo:[75,0,130,1],khaki:[240,230,140,1],lightblue:[173,216,230,1],lightcyan:[224,255,255,1],lightgreen:[144,238,144,1],lightgrey:[211,211,211,1],lightpink:[255,182,193,1],lightyellow:[255,255,224,1],lime:[0,255,0,1],magenta:[255,0,255,1],maroon:[128,0,0,1],navy:[0,0,128,1],olive:[128,128,0,1],orange:[255,165,0,1],pink:[255,192,203,1],purple:[128,0,128,1],violet:[128,0,128,1],red:[255,0,0,1],silver:[192,192,192,1],white:[255,255,255,1],yellow:[255,255,
0,1],transparent:[255,255,255,0]}})(jQuery);

④ 使用JS,如果通过一个RGB颜色来获取这个颜色的所有颜色(亮度,灰度变化),如图。

问题比较复杂,分步来讲:

  1. 因为你这张图,很显然是使用HSB颜色,固定H,S和B的取值范专围都是属0%~100%,所有可能的集合就是你的这张图,所以,首先要把rgb颜色转换成hsb颜色。

  2. 把得到的hsb颜色的h值固定,然后使用一个循环,把hsb(h,0%,0%)~hsb(h,100%,100%)都写入一个数组里,这里要注意hsb(h,12%,80%)和hsb(h,80%,12%)是不同的.

  3. 再把hsb颜色转换成rgb颜色,然后输出。

好了,思路有了,接下来难点在于rgb与hsb的颜色转换。

二者的转换复杂程度非同一般,所以,如果真的需要,HI我,给你一篇文章地址。这里打不出网址来。

⑤ 求js中颜色值变浅的算法,类似于下图

首先你的了解颜色的概念

下面我简单介绍下颜色概念在32位系统上我们所看到的颜色由RGB三原色显示再加上一个透明度通道就形成了多种多样的颜色

多的我就不多说了下面直接写一份演示代码

<!DOCTYPEhtml>
<html>
<head>
<title>test</title>
<style>
.tsetDiv{
width:40px;
height:40px;
border-radius:100%;
font-size:0;
display:inline-block;
margin-left:10px;
vertical-align:middle;
}
#boxF{
width:300px;
font-size:0;
height:auto;
}
</style>
</head>
<body>
<divid="boxF"></div>
<scripttype="text/javascript">
varboxf=document.getElementById("boxF");
vardivC=null;
varr=0;
varg=0;
varb=0;
for(vari=0;i<10;i++){
for(varj=0;j<10;j++){
divC=document.createElement("div");
divC.style.backgroundColor="rgb("+r+","+g+","+b+")";

divC.setAttribute("class","tsetDiv");
boxf.appendChild(divC);
}
//修改rgb加的不同值可以得到不同的效果rgb最大值为255所以不用担心超过不显示
r+=15;
g+=25;
b+=35;
}
</script>
</body>
</html>

运行效果为下图

阅读全文

与rgb模糊滤镜js算法相关的资料

热点内容
word07页码从任意页开始 浏览:791
js禁止滑动事件 浏览:800
苹果查序号怎么看不是 浏览:61
linux在txt文件 浏览:568
ps如何导入文件匹配 浏览:201
转转app怎么把自己的账号租出去 浏览:828
福昕阅读器合并照片pdf文件 浏览:591
vhd文件有什么用 浏览:482
编程小朋友看什么书 浏览:623
经营如何让数据说话 浏览:258
如何在手机上升级opop 浏览:614
coreldrawx5免费视频教程 浏览:725
网站引导页面源码 浏览:234
个人简历范文word 浏览:220
uc下载的视频怎样提取到文件 浏览:499
英雄下载下载最新版本2015下载安装 浏览:433
NX深孔钻编程替换面如何操作 浏览:725
手机怎么删除pdf文件 浏览:256
苹果手机没有efs文件夹怎么办 浏览:723
metro软件在哪个文件夹 浏览:69

友情链接