WebGL中precision是什么？ 指定精确度的precision

最新推荐文章于 2024-10-09 11:13:10 发布
最新推荐文章于 2024-10-09 11:13:10 发布
阅读量1.5k 收藏 2
点赞数 1
分类专栏： WebGL 文章标签： webgl precision
本文深入探讨了GLSL（OpenGL着色语言）中的精度修饰符概念，包括lowp、mediump和highp，解释了它们如何影响着色器中float类型数值的精确度，并强调了在片段着色器中设定精度的重要性。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

指定精确度的precision

这一次的片段着色器中的第一行，出现了一个陌生的precision，这个precision是用来指定数值的精确度的关键字，紧接着跟在precision后面的是精确度修饰符。
这个修饰符有三种，简单点说就是指定精确度为上，中，下。其实，变量中使用的小数发生变化时（也就是说，处理的数值的位数增加或是减少），根据运行的环境不同得到的结果是不太统一的。
lowp   ：精确度低
mediump：精确度中
highp  ：精确度高
上面的片段着色器代码中，precision后面紧接着写的是mediump float，这是说，让片段着色器中的float类型的数值的精确度都按照mediump来用。
不管在片段着色器中有没有做什么特殊的处理，首先要将precision相关的设定写上，否则在编译着色器的时候会出错。这就像魔法的咒语一样，逃不掉的。

 

摘自：https://blog.youkuaiyun.com/lufy_Legend/article/details/38461309

（十七）WebGL中 图像处理的初识
cuijiying的博客
02-20 1605
WebGL 是一种 JavaScript API，基于 OpenGL 标准，利用 GPU 在浏览器中进行高效的图形渲染。对于图像处理，它特别适合需要快速计算的大型图像或复杂操作，因为 GPU 可以并行处理大量像素。
玩转WebGL(三)着色器
q641187432的专栏
01-21 583
上节中,将着色器代码直接写在字符串里太麻烦了,不方便.所以要把它拆分出去. 1.拆分 在src下创建shader文件夹,新建Dot.vs和Dot.fs文件 Dot.vs: void main() { gl_Position = vec4(0.0, 0.0, 0.0, 1.0); // Set the vertex coordinates of the point gl_PointSize = 50.0; // Set the point size }
指定精确度(*号的使用)
weixin_34133829的博客
08-19 141
*号的使用 1 #include <stdio.h> 2 3 int main(void) 4 { 5 unsigned width, precision; 6 float height; 7 printf("Please enter you height(enter a tag before):\n"); 8 sc...
WebGL着色器精度设置(lowp、mediump、highp和precision)
u014291990的博客
11-20 6344
着色器运算精度设置 本文是WebGL教程(电子书)的2.12节内容 通过设置着色器数值的精度可以更好的配置资源，可以根据需要，在不太影响渲染效果前提下，可以尽量降低运算精度。 lowp、mediump和highp关键字 声明变量精度高低的三个关键子lowp、mediump和highp。 关键子 精度 lowp 低精度 mediump 中精度 highp 高精度 声明单个...
地图开发中WebGL着色器32位浮点数精度损失问题
@宝儿姐
05-27 329
以下内容转载自木的树的文章《WebGL着色器32位浮点数精度损失问题》 作者：木的树 链接：https://www.cnblogs.com/dojo-lzz/p/11250327.html 来源：博客园 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。 前言 Javascript API GL是基于WebGL技术打造的3D版地图API，3D化的视野更为自由，交互更加流畅。 提供丰富的功能接口，包括点、线、面绘制，自定义图层、个性化样式及绘图、测距工具等，使开发者更加容易的实现产品构思.
WebGL 规范（WebGL Specification）
太阳火神的美丽人生
05-29 8257
WebGL 规范（WebGL Specification）
glsl中lowp, mediump, highp的区别 (Precision Qualifier)
GetRekt的博客
08-26 1万+
定义 浮点数和整数类型的区间和精度取决于数据来源(varying, uniform, texture look-up, etc.)， 是在片元着色器还是在顶点着色器中，及其他细节。Precision Qualifier的用处就是定义一个变量的最小的储存需求。 Precision Qualifiers 任何浮点数或整数的定义可以由这三个precision qualifier之中的一个定义 例子 l...
WebGL
2301_80269780的博客
07-29 3570
WebGL全称叫做Web Graphics Library，它是JavaScrint API、用于在任何兼容的Web浏览器中演染交互式的3D图形，并且无需使用插件。它基于 OpenGL ES 2.0(一个用于嵌入式系统的图形库)，并与其他 Web 标准完全集成，使开发者能够利用 GPU 加速图形处理直接在网页上实现复杂的图形效果。WebGL可以在网页上开发高性能的3D游戏，许多现代网页游戏都利用了WebGL实现了丰富的图形效果和流畅的用户体验。
WebGL系列教程十一（光照原理及Blinn Phong着色模型）
AIGIS的博客
10-09 1497
什么是光照？光照就是模拟出物体被光照射时的效果，使得渲染场景看起来更真实。那么WebGL在干什么？WebGL其实就是在计算继而还原每个像素的颜色和亮度。这就是我们这一节所要讲的内容，对一个立方体进行光照的渲染。本文介绍了光照原理的基础，并在此基础上讲解了法线计算、入射光计算、反射光计算、逆转置矩阵等等，最后我们使用着色模型，通过组合高光、漫反射和环境光，实现了对一个立方体的动态光照效果渲染。本文在理解上有一定的难度，希望读者仔细体会，回见~
掌握这些概念，不用担心看不懂OpenGL ES着色语言了
热门推荐
徐福记456
04-01 4万+
在OpenGL ES图形学中，着色语言(Shading Language)是一门必修课。在看openGL代码时，都会有着色语言的身影，它有自己的一套语法和格式。提供给我们进行编程的包括顶点着色器和片元着色器，它们都遵循着色语言语法。 ...
webgl学习之路(一)——基础概念shader
mmmMMM12345的博客
06-22 463
首先是shader，这个名词经常听，其实它就是一段代码。 然后有专门编写shader的语言，比如： 基于OpenGL的OpenGL Shading Language，简称GLSL。 基于DirectX的High Level Shading Language,简称HLSL。 还有NVIDIA公司的C for Graphic，简称Cg语言。 shader分为：顶点shader和片段（片元）shader 顶点shader顾名思义就是负责坐标中的顶点。还有每个顶点的颜色值。 当然它还负责将一些变量从顶点
Unity Shader - Shader data types and precision 着色器数据类型和精度
Jave.Lin 的学习笔记
07-03 1363
目录：Unity Shader - 知识点目录（先占位，后续持续更新） 原文：Shader data types and precision 版本：2019.1 Shader data types and precision 着色器数据类型和精度 在Unity中，标准的Shader语言是HLSL，一般的HLSL数据类型都支持。但是，Unity也有一些HLSL之外的类型，为了更好的支持移动平台。 B...
WebGL-Shader入门（3.着色器语言的限定词-参数限定词/存储限定词/精度限定词）
点燃火柴的博客
07-04 770
矢量类型和矩阵类型变量的访问与运算1. 序 1. 序 上一篇文章介绍了着色器语言的数据类型和简单使用，不过没有介绍矢量类型和矩阵类型的访问和运算，它们有很多想通之处，内容相对较多，所以专门用一篇文章来讲述。就先从它们的访问说起 ...
OpenGL ES着色器语言之变量和数据类型（二）（官方文档第四章）
飞鱼
07-18 1万+
4.5精度和精度修饰符 4.5.1范围和精度         用于存储和展示浮点数、整数变量的范围和精度依赖于数值的源（varying，uniform，纹理查找，等等），是不是顶点或者片元着色器，还有其他一些底层实现的细节。最低存储需要通过精度修饰符来声明。典型地，精度操作必须要保留变量包含的精度存储。仅有的例外是需要大量复杂计算的内建函数，如atan（），返回值的精度低于声明的精度。
13 WebGL 着色器编程语言GLSL ES的精度限定字
现在学习也不晚
05-31 2918
GLSL ES新引入了精度限定字，目的是帮助着色器程序提高运行效率，消减内存开支。顾名思义，精度限定字用来表示每种数据具有的精度（比特数）。简而言之，高精度的程序需要更大的开销（包括更大的内存和更久的计算时间），而低精度的程序需要开销则小得多。使用精度限定字，你就能精细地控制程序在效果和性能间的平衡。然而，精度限定字是可选的，如果你不确定，可以使用下面这个适中的默认值： #ifdef GL_ES
WebGL 技术储备指南
多多
07-02 8959
WebGL 是 HTML 5 草案的一部分，可以驱动 Canvas 渲染三维场景。WebGL 虽然还未有广泛应用，但极具潜力和想象空间。本文是我学习 WebGL 时梳理知识脉络的产物，花点时间整理出来与大家分享。 示例 WebGL 很酷，有以下 demos 为证： 寻找奥兹国 赛车游戏 划船的男孩(Goo Engine Demo) 本文的目标 本文的预期读者是
GLSL 数据精度
lzt20007的专栏
03-28 7735
1. 默认精度 顶点着色器中默认精度 precision highp float; precision highp int; precision lowp sampler2D; precision lowp samplerCube; 像素着色器中默认精度 precision mediump int; precision lowp sampler2D; precision lo
OpenGL ES着色器语言之变量和数据类型
hgl868的专栏
08-09 2万+
所有变量和函数在使用前必须声明。变量和函数名是标识符。        没有默认类型，所有变量和函数声明必须包含一个声明类型以及可选的修饰符。变量在声明的时候首先要标明类型，后边可以跟多个变量，之间用逗号隔开。很多情况下，变量在声明的时候可以使用等号“=”进行初始化。        用户定义类型可以使用struct，在结构体中所有变量类型都必须是OpenGL ES着色器语言定义的关键字。Op
cesium 气象 3D
最新发布
02-25
### 使用 Cesium 实现气象 3D 可视化 #### 利用现有项目作为基础 对于希望利用 Cesium 进行气象相关的三维可视化的开发者来说，可以借鉴已有的开源项目。例如 `cesium-wind` 提供了一个风层的实现方案[^1]。此项目位于特定的 Git 托管平台上，通过研究该项目源码能够获取有关如何集成和显示气象数据至 Cesium 场景中的宝贵经验。 #### 加载气象数据集 为了在 Cesium 中展示气象现象，通常需要加载相应的气象数据集。这些数据可能来自多种渠道，比如 NOAA（美国国家海洋和大气管理局）、ECMWF（欧洲中期天气预报中心）等机构发布的公开资源。这类数据往往采用 NetCDF 或 GRIB 文件格式存储温度、湿度、气压以及风向等多种参数的信息。Cesium 支持直接读取某些类型的二进制文件来构建动态模型，从而使得复杂的大气状况得以重现于虚拟环境中[^2]。 #### 创建自定义材质与着色器 要使气象效果更加生动形象，则需编写自定义材质及 WebGL 着色程序。这一步骤允许开发人员精确控制渲染过程中的颜色映射逻辑，进而依据实际观测到的数据调整视觉表现形式。举例而言，当描绘云系分布时，可以根据不同高度处水汽含量的变化设置透明度渐变；而在表示降雨强度方面，则可通过改变粒子系统的发射速率达成目的。 ```javascript // 定义一个简单的顶点着色器片段 const vertexShaderSource = ` attribute vec3 position; uniform mat4 modelViewProjection; void main() { gl_Position = modelViewProjection * vec4(position, 1.0); }`; // 片元着色器负责最终像素色彩计算 const fragmentShaderSource = ` precision mediump float; varying vec3 v_positionWC; void main(){ // 假设此处存在某种算法决定当前坐标的颜色值 vec3 color = /* ... */; gl_FragColor = vec4(color, 1.0); }`; ``` #### 整合交互功能提升用户体验 最后但同样重要的是增加必要的用户界面组件以便操作者更好地探索所关心区域内的气象特征。借助 HTML/CSS 技术配合 JavaScript 编程接口，可轻松搭建起诸如时间轴滑块、图例说明框之类的控件，让用户自由切换查看不同时刻下的变化趋势或是查询具体位置上的数值详情。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值