css颜色转webgl颜色
将rgba颜色解析成webgl能认识的颜色
<style>
body{
margin:0;
overflow:hidden;
}
#canvas{
background-color:antiquewhite;
}
</style>
<body>
<canvas id="canvas"></canvas>
<script>
const canvas = document.querySelector("#canvas");
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
//canvas里面二维画笔
//const gl = canvas.getContext("2d");
//canvas里面三维画笔
const gl = canvas.getContext("webgl");
//声明颜色rgba
gl.clearColor(0,0,0,1);
//刷底色
gl.clear(gl.COLOR_BUFFER_BIT);
//css颜色
const rgbaCss = 'rgba(255,0,0,1)'
//正则
const reg = RegExp(/\((.*)\)/)[1]
//捕捉数据
const regbaStr = reg.exec(rgbaCss)
//加工数据
const rgba = rgbaStr.split(',').map(n=>parseInt(n))
const r = rgba[0]/255
const g = rgba[1]/255
const b = rgba[2]/255
const a = rgba[3]
//声明颜色rgba
gl.clearColor(r,g,b,a);
//刷底色
gl.clear(gl.COLOR_BUFFER_BIT);
</script>
</body>
