<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[树后树前]]></title><description><![CDATA[]]></description><link>https://blog.csdn.net/cRGBc</link><language>zh-cn</language><generator>https://blog.csdn.net/</generator><copyright><![CDATA[Copyright &copy; cRGBc]]></copyright><item><title><![CDATA[阿里云、toDesk 无法登录问题（应用网络状况不佳等）]]></title><link>https://blog.csdn.net/cRGBc/article/details/129329677</link><guid>https://blog.csdn.net/cRGBc/article/details/129329677</guid><author>cRGBc</author><pubDate>Sat, 04 Mar 2023 01:54:22 +0800</pubDate><description><![CDATA[等环境变量，因为阿里云盘的客户端是 electron 程序，我根据其日志输出观察到它实际上在请求一个网址的时候出现异常，实际上它是在走。问题和你在网络上搜索的结果应该差不多，就是时区和时间没有和当前正确的时间、时区同步，你只需打开 Windows 的同步就可以。等代理途径在访问公网，然而这并不被服务器允许，因为经过代理的时间可能是别的地区的，和服务器的时区不一样，就会被拒绝。关键是，如果你开了代理软件，或者设置了。]]></description><category></category></item><item><title><![CDATA[OGC WebGIS 常用服务标准（WMS/WMTS/TMS/WFS）速查]]></title><link>https://blog.csdn.net/cRGBc/article/details/125863060</link><guid>https://blog.csdn.net/cRGBc/article/details/125863060</guid><author>cRGBc</author><pubDate>Tue, 19 Jul 2022 00:22:33 +0800</pubDate><description><![CDATA[你在WMTS能力文档中，一定能看到这两个东西。但是我觉得官方文档废话太多，索性把自己的理解写了出来。笔者译为“瓦片阵集”，而TileMatrix即“瓦片阵”。很多人也许第一次看到这个词，一时半会儿想不通为什么是“Matrix”。直译来说，“Matrix”即矩阵假如这个矩阵的每个元素块上填充的是地图瓦片，那就能理解了。所以，TileMatrix指的就是某个层级的所有瓦片；自然而然，就是所有层级的TileMatrix“集”。举例，GeoServer中的内置瓦片阵集有一个是EPSG4326。...]]></description><category></category></item><item><title><![CDATA[在 WebGPU 的片元着色器中访问帧缓冲坐标]]></title><link>https://blog.csdn.net/cRGBc/article/details/124448210</link><guid>https://blog.csdn.net/cRGBc/article/details/124448210</guid><author>cRGBc</author><pubDate>Wed, 27 Apr 2022 12:32:51 +0800</pubDate><description><![CDATA[文章目录1. 技术说明2. 三角形例子HTMLJavaScript3. 着色器解析帧缓冲坐标图示

1. 技术说明

使用最新 Edge/Chrome Canary 浏览器
使用 VSCode 插件 LiveServer 的 HTTP 服务器对本机提供 5500 端口的页面服务，即 http://localhost:5500/index.html
使用 es-module 风格的 JavaScript 实现

2. 三角形例子
先上效果，后面再解析片元着色器：

HTML
html 部分就简单一些
&lt;]]></description><category></category></item><item><title><![CDATA[WebGPU 工具分享 - WGSL 代码高亮插件（VSCode）与预处理工具]]></title><link>https://blog.csdn.net/cRGBc/article/details/123737958</link><guid>https://blog.csdn.net/cRGBc/article/details/123737958</guid><author>cRGBc</author><pubDate>Fri, 25 Mar 2022 15:54:32 +0800</pubDate><description><![CDATA[文章目录① WGSL 插件② WGSL Literal 插件③ WGSL Preprocessor为什么没有 #define 宏？

WGSL 还在积极讨论中，虽然各位大佬不是很满意这个新生儿。
不过，社区已经有了基础的实验性工具（VSCode 插件），并支持了较新的语法。
① WGSL 插件
这个插件支持对文件扩展名为 .wgsl 的源代码文件进行高亮显示。

② WGSL Literal 插件
这个插件允许你在 JavaScript / TypeScript 的模板字符串中进行 wgsl 代码高亮，需要]]></description><category></category></item><item><title><![CDATA[WebGPU 计算管线、计算着色器（通用计算）入门案例：2D 物理模拟]]></title><link>https://blog.csdn.net/cRGBc/article/details/123626125</link><guid>https://blog.csdn.net/cRGBc/article/details/123626125</guid><author>cRGBc</author><pubDate>Mon, 21 Mar 2022 12:15:00 +0800</pubDate><description><![CDATA[文章目录1. WebGL2. WebGPU2.1. 适配器（Adapter）和设备（Device）2.2. 着色器（Shaders）2.3. 管线（Pipeline）2.4. 并行（Parallelism）2.5. 工作组（Workgroup）2.6. 指令（Command）3. 数据交换3.1. 绑定组的布局（GPUBindGroupLayout）3.2. 暂存缓冲区（Staging Buffer）3.3. 过度调度3.4. 麻烦的结构体（内存地址对齐问题）3.5. 输入输出4. 性能5. 稳定性与可用性]]></description><category></category></item><item><title><![CDATA[WebGL 与 WebGPU比对[8] - 系列完结总结与感想]]></title><link>https://blog.csdn.net/cRGBc/article/details/123470133</link><guid>https://blog.csdn.net/cRGBc/article/details/123470133</guid><author>cRGBc</author><pubDate>Mon, 14 Mar 2022 12:15:00 +0800</pubDate><description><![CDATA[文章目录系列完结后记之后要做什么

系列完结后记
林林总总写了一些文章来对比 WebGL 与 WebGPU 的常规功能，兴许在 API 的理解上有些业余，甚至不排除有表述错误，但是写对的部分，我希望对读者与未来的图形开发者有所启迪。
过去，WebGL 给 Web 图形开发者打开了一扇新的大门：

原来浏览器可以不借助插件搞酷炫的三维效果！

这离不开各大厂商的努力，虽然他们肯定有一部分原因是想更好卖产品，但不否认这的的确确是技术的迈进。
诚然，图形有门槛，WebGL 给这十年来的开发者留下一个蚀刻进骨子里的]]></description><category></category></item><item><title><![CDATA[WebGL 与 WebGPU比对[7] - 渲染的目的地]]></title><link>https://blog.csdn.net/cRGBc/article/details/123470130</link><guid>https://blog.csdn.net/cRGBc/article/details/123470130</guid><author>cRGBc</author><pubDate>Mon, 14 Mar 2022 12:15:00 +0800</pubDate><description><![CDATA[文章目录1. 综述2. WebGL 中的绘图区3. WebGPU 中配置 canvas 的连接关于改变 canvas 大小后的行为

1. 综述
其实，写到第六篇比对基本上常规的 API 就差不多比对完了（除了 GPGPU、查询方面的 API 未涉及），但是有一个细节仍然值得我开一篇比对文章进行思考、记录，那就是渲染到何处。
WebGL 的上下文对象是与 canvas 元素强关联的，没有 canvas 创建不了上下文，也就是说，WebGL 在设计之初就是拿来绘图的（的确如此），没考虑 GPU 的其它功能，后]]></description><category></category></item><item><title><![CDATA[WebGL 与 WebGPU比对[6] - 纹理]]></title><link>https://blog.csdn.net/cRGBc/article/details/123470129</link><guid>https://blog.csdn.net/cRGBc/article/details/123470129</guid><author>cRGBc</author><pubDate>Mon, 14 Mar 2022 12:15:00 +0800</pubDate><description><![CDATA[文章目录1. WebGL 中的纹理1.1. 创建二维纹理与设置采样参数1.2. 纹理数据写入与拷贝1.3. 着色器中的纹理1.4. 纹理对象 vs 渲染缓冲对象1.5. 立方体六面纹理1.6. WebGL 2.0 的变化1.7. Mipmapping 技术2. WebGPU 中的纹理2.1. GPUTexture 的创建2.2. 纹理数据写入与拷贝2.3. 纹理视图2.4. 着色器中的纹理与采样器2.5. WebGPU 中的 Mipmapping3. 纹理压缩编码算法4. 总结参考资料

图形编程中的纹理，]]></description><category></category></item><item><title><![CDATA[Cesium 1.91 更新日志 - MSAA 与原生 Promise 来了]]></title><link>https://blog.csdn.net/cRGBc/article/details/123220857</link><guid>https://blog.csdn.net/cRGBc/article/details/123220857</guid><author>cRGBc</author><pubDate>Wed, 02 Mar 2022 12:01:52 +0800</pubDate><description><![CDATA[文章目录不兼容式更新📣新增🎉问题修复🔧个人点评🖊① MSAA② 相机获取射线③ ModelExperimental④ 逐渐 ES6

不兼容式更新📣

在下一个版本，也就是 Cesium 1.92，第三方库 when.js 将被原生 Promise API 代替。Cesium.when 将被废弃，且于下个版本移除。关于如何升级，请参考下方个人点评，我转载了官方指导文档。]]></description><category></category></item><item><title><![CDATA[OpenLayers 6.13 新特性]]></title><link>https://blog.csdn.net/cRGBc/article/details/123220866</link><guid>https://blog.csdn.net/cRGBc/article/details/123220866</guid><author>cRGBc</author><pubDate>Wed, 02 Mar 2022 12:01:16 +0800</pubDate><description><![CDATA[文章目录1 概述2 细节2.1 新方法 - layer.getData()2.2 弃用方法 - map.forEachLayerAtPixel()
1 概述
6.13 版本带来了一些新特性：

对于每个图层对象，你可以使用 layer.getData() 方法来获取它的像素数据
类 ol/style/Text 支持了富文本标签，可以在一个标签中用不同的字体、样式了
模块 ol/proj 中，useGeographic() 和 setUserProjection() 方法现在已经是官方 API 了，这两个方法]]></description><category></category></item><item><title><![CDATA[为何在打包工具中导入 Cesium 的 css 失败了？]]></title><link>https://blog.csdn.net/cRGBc/article/details/123189334</link><guid>https://blog.csdn.net/cRGBc/article/details/123189334</guid><author>cRGBc</author><pubDate>Mon, 28 Feb 2022 18:57:47 +0800</pubDate><description><![CDATA[文章目录1 问题起因2 寻找解决方案2.1. 历史原因2.2. 增加导出2.3. 耍个花招3 类型提示是哪来的

1 问题起因
我使用 vite2 + vanillajs 模板创建 CesiumJS 项目，其中，main.js 是这样的：
import { Viewer } from 'cesium'
import './style.css'
import 'cesium/Source/Widgets/widgets.css'

let viewer
const main = () =&gt; {
  co]]></description><category></category></item><item><title><![CDATA[WebGL 与 WebGPU比对[5] - 渲染计算的过程]]></title><link>https://blog.csdn.net/cRGBc/article/details/123173839</link><guid>https://blog.csdn.net/cRGBc/article/details/123173839</guid><author>cRGBc</author><pubDate>Mon, 28 Feb 2022 03:02:58 +0800</pubDate><description><![CDATA[文章目录1. WebGL1.1. 使用 WebGLProgram 表示一个计算过程1.2. WebGL 没有通道 API2. WebGPU2.1. 使用 Pipeline 组装管线中各个阶段2.2. 使用 PassEncoder 调度管线内的行为2.3. 使用 CommandEncoder 编码多个通道2.4. PassEncoder 和 Pipeline 的关系3. 总结

前两篇文章介绍了 WebGL 和 WebGPU 是如何准备顶点和数字型 Uniform 数据的（纹理留到下一篇），当渲染所需的原材料]]></description><category></category></item><item><title><![CDATA[WebGL 与 WebGPU比对[4] - Uniform]]></title><link>https://blog.csdn.net/cRGBc/article/details/123013864</link><guid>https://blog.csdn.net/cRGBc/article/details/123013864</guid><author>cRGBc</author><pubDate>Sat, 19 Feb 2022 03:11:47 +0800</pubDate><description><![CDATA[文章目录1. WebGL 1.0 Uniform1.1. 用 WebGLUniformLocation 寻址1.2. 矩阵赋值用 uniformMatrix[234]fv1.3. 标量与向量用 uniform\[1234]\[fi]\[v]1.4. 传递纹理2. WebGL 2.0 Uniform2.1. 标量/向量/矩阵传值方法扩充2.1. 什么是 UniformBlock 与 UniformBuffer 的创建2.2. 状态绑定2.3. 着色器中的 Uniform2.4. 传递纹理3. WebGPU U]]></description><category></category></item><item><title><![CDATA[在 esmodule 环境下使用 jsts]]></title><link>https://blog.csdn.net/cRGBc/article/details/122928260</link><guid>https://blog.csdn.net/cRGBc/article/details/122928260</guid><author>cRGBc</author><pubDate>Mon, 14 Feb 2022 17:05:42 +0800</pubDate><description><![CDATA[文章目录1 说明Geometry 类2 安装3 使用以 buffer 为例4 JTS 文档

1 说明
jsts 完全就是根据其老妈 jts 的 java 包结构移植的，除了部分分析功能需要额外注意外，基本上所有的子模块的根路径位于 jsts/org/locationtech/jts 模块下。
Geometry 类
Geometry 类符合 OGC 简单要素规范的设计。它有若干个子类，例如点线面等。
Geometry 在 JTS 上有非常多实用的空间分析函数：
buffer, buffer, buffer,]]></description><category></category></item><item><title><![CDATA[WebGL 与 WebGPU比对[3] - 顶点缓冲]]></title><link>https://blog.csdn.net/cRGBc/article/details/122917271</link><guid>https://blog.csdn.net/cRGBc/article/details/122917271</guid><author>cRGBc</author><pubDate>Mon, 14 Feb 2022 03:25:24 +0800</pubDate><description><![CDATA[文章目录1. WebGL 中的 VBO1.1. 创建 WebGLBuffer1.2. 顶点着色器2. WebGPU2.1. 创建 GPUBuffer 与传递数据2.2. 将顶点缓冲的格式信息传递给顶点着色器2.3. 在渲染通道中设置顶点缓冲2.4. 顶点着色器2.5. 关于缓冲数据在内存与显存中的申请、传递与销毁3. 比对4. VertexArrayObject
1. WebGL 中的 VBO
1.1. 创建 WebGLBuffer
WebGL 使用 TypedArray 进行数据传递，这点 WebGPU ]]></description><category></category></item><item><title><![CDATA[WebGPU 中消失的 FBO 和 RBO]]></title><link>https://blog.csdn.net/cRGBc/article/details/122917238</link><guid>https://blog.csdn.net/cRGBc/article/details/122917238</guid><author>cRGBc</author><pubDate>Mon, 14 Feb 2022 02:39:50 +0800</pubDate><description><![CDATA[文章目录1 WebGL 中的 FBO 与 RBO1.1 帧缓冲对象（FramebufferObject）1.2 颜色附件与深度模板附件的真正载体1.3 FBO/RBO/WebGLTexture 相关方法收集2 WebGPU 中的对等概念2.1 渲染通道编码器（GPURenderPassEncoder）承担 FBO 的职能2.2 多目标渲染2.3 深度附件与模板附件2.4 非 canvas 的纹理对象作为两种附件的注意点3 读取数据3.1 从 FBO 中读像素值3.2 WebGPU 读 GPUTexture ]]></description><category></category></item><item><title><![CDATA[WebGPU 中的缓冲映射机制]]></title><link>https://blog.csdn.net/cRGBc/article/details/122890867</link><guid>https://blog.csdn.net/cRGBc/article/details/122890867</guid><author>cRGBc</author><pubDate>Fri, 11 Feb 2022 23:58:24 +0800</pubDate><description><![CDATA[文章目录1. 什么是缓冲映射创建时映射2 缓冲数据的流向2.1 CPU 至 GPU2.2 GPU 至 CPU
1. 什么是缓冲映射
就不给定义了，直接简单的说，映射（Mapping）后的某块显存，就能被 CPU 访问。
三大图形 API（D3D12、Vulkan、Metal）的 Buffer（指显存）映射后，CPU 就能访问它了，此时注意，GPU 仍然可以访问这块显存。这就会导致一个问题：IO冲突，这就需要程序考量这个问题了。
WebGPU 禁止了这个行为，改用传递“所有权”来表示映射后的状态，颇具 Rus]]></description><category></category></item><item><title><![CDATA[WebGPU 补充篇之 VertexBuffer]]></title><link>https://blog.csdn.net/cRGBc/article/details/120418806</link><guid>https://blog.csdn.net/cRGBc/article/details/120418806</guid><author>cRGBc</author><pubDate>Wed, 09 Feb 2022 16:00:57 +0800</pubDate><description><![CDATA[系列博客总目录：https://blog.csdn.net/cRGBc/article/details/120412614
文章目录VertexBuffer 的创建WGSL 端接受输入VertexBuffer 的数据传入

VertexBuffer 的创建
VertexBuffer 的本体就是一个 GPUBuffer，主要就是指定其 usage，以及在创建 ShaderModule 时配置好 VertexAttribute。
顶点属性，所谓的 VertexAttribute，在 VertexBuffer 中]]></description><category></category></item><item><title><![CDATA[WebGPU 规范篇 11 Canvas上下文]]></title><link>https://blog.csdn.net/cRGBc/article/details/120418755</link><guid>https://blog.csdn.net/cRGBc/article/details/120418755</guid><author>cRGBc</author><pubDate>Wed, 09 Feb 2022 16:00:31 +0800</pubDate><description><![CDATA[系列博客总目录：https://blog.csdn.net/cRGBc/article/details/120412614
文章目录1 GPUCanvasContext2 GPUCanvasConfiguration 类型举例GPUCanvasCompositingAlphaMode 枚举类型3 Canvas 尺寸变更问题

对应规范中 Canvas Rendering 一章
1 GPUCanvasContext
GPUCanvasContext 类型，其对象被称作 WebGPU 上下文。
它的作用就是让 ]]></description><category></category></item><item><title><![CDATA[WebGPU 规范篇 09 通道]]></title><link>https://blog.csdn.net/cRGBc/article/details/120418674</link><guid>https://blog.csdn.net/cRGBc/article/details/120418674</guid><author>cRGBc</author><pubDate>Wed, 09 Feb 2022 15:59:56 +0800</pubDate><description><![CDATA[系列博客总目录：https://blog.csdn.net/cRGBc/article/details/120412614
文章目录可编程通道编码器：GPUProgrammablePassEncoder创建通道编码器设置绑定组 setBindGroup1 渲染通道编码器1.1 创建1.1.1 颜色附件GPULoadOp：初始化行为GPUStoreOp：存储行为1.1.2 深度模板附件1.1.3 译者注1.2 触发绘制功能相关的方法setPipeline 方法setVertexBuffer 方法setBind]]></description><category></category></item></channel></rss>