摘要: glsl语法(边学习边更新...) 1.变量类型 基础数据类型 类型 示例 备注 bool bool isFact = false; int int num1 = 1; uint uint num1 = 1; 无符号整数,#version 400 及以上才支持,老版本无法使用此数据类型 float 阅读全文
posted @ 2024-02-23 17:34 邢韬 阅读(21) 评论(0) 推荐(0) 编辑
摘要: 闪烁的核心就是根据时间变颜色或者透明度 时间我们可以采用如下代码 fract 代表取小数,czm_frameNumber 是一个根据帧率无限增大的数值,如下公式就是一个0-1之间无限循环的数值,根据这个数值我们就可以做到闪烁的效果 float time = fract(czm_frameNumber 阅读全文
posted @ 2024-02-06 10:50 邢韬 阅读(38) 评论(0) 推荐(0) 编辑
摘要: 动态绘制点 动态传递顶点坐标 绘制动态点需要进行 JavaScript 和 GLSL 之间的信息交互,即将JS代码中指定的点位传入GLSL中进行绘制。 常规顶点着色器代码如下,我们需要通过JS代码给 gl_Position 传值来动态的绘制点位。 const VertexSource = ` voi 阅读全文
posted @ 2024-01-30 09:53 邢韬 阅读(10) 评论(0) 推荐(0) 编辑
摘要: 绘制一个点 编写简单的着色器代码 首先,我们先了解一下代码中用到的 GLSL 语言的 类型 和 内置变量。 顶点着色器 用到的数据类型 顶点着色器的内置变量 内置函数 gl_Position的类型—— vec4 明显比 gl_PointSize 的 float 要特别。如果说我们需要的顶点坐标数据是 阅读全文
posted @ 2024-01-12 15:43 邢韬 阅读(14) 评论(0) 推荐(0) 编辑
摘要: WebGL绘图流程 下图中,可清晰得知 WebGL 需要两种着色器: 顶点着色器。用来描述顶点属性,比如坐标位置。其中,顶点我们可以理解为他是三维空间中的一个点(x, y, z)。 片元着色器。逐片元处理颜色。片元是 WebGL 的术语,它其实指的是每一个像素,逐片元的意思就是计算出当前绘制的每个像 阅读全文
posted @ 2024-01-12 11:14 邢韬 阅读(15) 评论(0) 推荐(0) 编辑
摘要: 以贴底线 GroundPolylinePrimitive 为例 我们知道,primitive的更新机制主要是通过update函数,所以通过源码我们可以很容易找到如何对针对性的更新属性。 可以看到,update 每次都会判断 _primitive 这个属性,如果他未定义,则重新构建geometry相关 阅读全文
posted @ 2023-12-29 11:43 邢韬 阅读(65) 评论(0) 推荐(0) 编辑
摘要: viewer.render(); viewer.canvas.toDataURL("image/png"); 阅读全文
posted @ 2023-10-20 11:20 邢韬 阅读(155) 评论(0) 推荐(0) 编辑
摘要: 找到cesium的package.json 将widgets.css手动导出: 阅读全文
posted @ 2023-09-15 11:13 邢韬 阅读(102) 评论(0) 推荐(1) 编辑
摘要: 创建一个 global.d.ts import * as C from "cesium"; // 扩展全局变量 declare global { // 定义全局Cesium类型 const Cesium: typeof C; // 允许扩展 Window interface Window { Ces 阅读全文
posted @ 2023-07-26 23:59 邢韬 阅读(106) 评论(0) 推荐(0) 编辑
摘要: 正则1 最初学正则的时候一笔带过没有认真学,导致每次想使用正则都是百度搜,最近重新学习了一下正则的语法,记录一下。 修饰符 i 忽略大小写 const reg = /a/i; let r1 = reg.test("abc"); console.log(r1); // true let r2 = re 阅读全文
posted @ 2023-06-11 22:32 邢韬 阅读(23) 评论(0) 推荐(0) 编辑