可视化
文章平均质量分 88
Neil-
吾日三省吾身~
展开
-
webgl透明视频
前置知识webGL图片纹理webgl动画纹理背景直播近年来的风头可以说是一时无两,游戏直播、颜值/才艺直播、带货直播;火爆的直播间通常有各种刷屏大礼物,通常是透明背景,这就是透明视频的主要用途之一;多数视频格式并不支持alpha通道,支持alpha通道的视频格式可以参考文献:List of video formats supporting alpha channels少数视频格式支持alpha通道,如webm、mov等;其中webm是google的标准,是一种视频容器格式,内部编码一般是v原创 2020-09-24 11:10:05 · 1026 阅读 · 0 评论 -
webgl动画纹理
动画纹理参考文献原创 2020-09-06 15:58:36 · 775 阅读 · 0 评论 -
webGL图片纹理
基础概念坐标定义:纹理坐标系范围是(0,1),左下角为(0,0),右上角为(1,1);webGL几何坐标系:x(-1, 1) y(-1, 1)gl.createTexture() —— 创建并初始化一个WebGLTexture对象,即创建一个纹理;gl.bindTexture(target, texture)将给定的texture绑定到目标,其中texture参数为创建的纹理对象,target为绑定点,类型为GLenum,支持的值包括gl.TEXTURE_2D(二维纹理)、gl.T原创 2020-09-04 18:49:31 · 1171 阅读 · 0 评论 -
GPU工作原理及WebGL入门
基础坐标系WebGL是一个三维直角坐标系。它的坐标原点比较特殊,是画布的中心位置;x轴向右,y轴向下,z轴朝外,并且x轴和y轴在画布中的范围是-1至1;绘制一个三角形import React, { useEffect, useRef } from "react";import "./styles.css";export default function App() { const canvasRef = useRef(); useEffect(() => { /**原创 2020-07-14 21:23:42 · 1517 阅读 · 0 评论