From d1c9b3487676d577f057a7c554e9c97cfdcd18ad Mon Sep 17 00:00:00 2001 From: lmj01 Date: Tue, 24 Sep 2024 13:43:22 +0800 Subject: [PATCH] update --- cg/canvas.md | 15 +-------------- cg/mesh/tangnent.md | 10 +++++++++- cg/threejs/index.md | 12 ++++++++++++ cg/tools/camera.md | 25 +++++++++++++++++++++++-- cpl/cplusplus.md | 6 ++++++ exercises/book-info.md | 5 +++++ index/article.md | 1 + index/book-info.md | 7 +++++++ index/standard.md | 7 +++++++ 9 files changed, 71 insertions(+), 17 deletions(-) diff --git a/cg/canvas.md b/cg/canvas.md index 9a5cc70..322d62f 100644 --- a/cg/canvas.md +++ b/cg/canvas.md @@ -103,17 +103,4 @@ ctx.translate(-center.x, -center.y); - [OffscreenCanvas-离屏canvas使用说明](https://zhuanlan.zhihu.com/p/100375855) - [canvas-scale](https://dustinpfister.github.io/2019/03/06/canvas-scale/),这篇文章很详细的介绍了canvas关于scale的细节,配合[playground](https://playcode.io/1833399)查看结果 - -## 经验 - - -### 2024-4-19 -在使用CanvasRenderingContext2D.drawImage以canvas为参数时,关于图像的放大问题,会陷入使用图像的逻辑中,先以中心点放大,再截图。 -在使用canvas实现这个逻辑时,小程序上的实现让我很郁闷。表现出了不是预期的情况。 -最后就是简单的绘制一部分到另外一个canvas上,就产生了预期的结果。实在令人困扰。 -这个可能与微信中canvas实现机制有关,那就好奇实现原理了。 - -### 2020-8-9 -图形学,在一些理论基础上,算是固定的,或是教科书上能列出来的东西,都是算是知识点,可是除了这些,还有一些特效,是在当前技术不能实现或达到要求的,通过迂回的方法来获得类似的结果,至少大部分人区分不了这些之间的差别。 -最近在分析别人的实现,隐适美的3D场景的显示,与实现的计算方案时,选择一个引擎,就发现其中的各种限制,比如关于orthographic camera的实现,目前还没有查到是与浏览器的实现,或本事就是存在的一种差异,比如对于阴影的实现,threejs是利用perspective camera来生成了一个结果来应用到结果上,如果全是orthographic camera的话,会产生什么样的结果呢? -每次看到别人把多个引擎,多个三维软件的结果做对比,可见我还只是停留在知识点上。系统的分析其内容是需要深厚的知识储备的。 \ No newline at end of file +- [MediaSource录屏canvas的封装库](https://github.com/ValeeraJS/WebRTCRecorder) diff --git a/cg/mesh/tangnent.md b/cg/mesh/tangnent.md index 0981b15..e164eba 100644 --- a/cg/mesh/tangnent.md +++ b/cg/mesh/tangnent.md @@ -128,4 +128,12 @@ MikkTSpace生成tangent space即使改变了点索引,面的顺序,删除pri ## [论文--重新审视褶皱表面的模拟Simulation of Wrinkled Surfaces Revisited](http://image.diku.dk/projects/media/morten.mikkelsen.08.pdf) - wrinkled surface皱折面 -- normal mapping is almost as common as texture mapping and directly supported in a wide range of graphics tools. However, normal mapping is hard to get right without following a strict set of rules. 正确的显示一定是约束在一些规则内才可以 A wrong implementation can lead to discontinuities in the shading. \ No newline at end of file +- normal mapping is almost as common as texture mapping and directly supported in a wide range of graphics tools. However, normal mapping is hard to get right without following a strict set of rules. 正确的显示一定是约束在一些规则内才可以 A wrong implementation can lead to discontinuities in the shading. + +### 2.2 Normal Mapping +由低分辨率的像素替换高分辨率像素,在vertex上的uv按照ray与normal映射到一个新的uv, +- Normal mapping can also be used to achieve bump mapping. ... Note that normal maps are three–channel textures as opposed to bump maps which consist of a single channel only法线Mapping也是达到bump mapping效果的,只是需要三通道的vu,而后者只需要单通道即可。 + +### 参考 + +- [A Practical and Robust Bump-mapping Technique for Today’s GPUs](https://my.eng.utah.edu/~cs5610/handouts/bumpmap.pdf) \ No newline at end of file diff --git a/cg/threejs/index.md b/cg/threejs/index.md index 81be162..f883d94 100644 --- a/cg/threejs/index.md +++ b/cg/threejs/index.md @@ -22,6 +22,13 @@ - [Collection of Examples Links to https://discourse.threejs.org/ and originals in source code ](https://hofk.de/main/discourse.threejs/) +### globe + +- [Globe with markers and label: thoughts, ideas, approaches, solutions](https://discourse.threejs.org/t/globe-with-markers-and-label-thoughts-ideas-approaches-solutions/34995) + - [Globe of Points: Markers + Label Paul ](https://codepen.io/prisoner849/pen/oNopjyb) +- [WebGL Globe is a platform for visualizing latitude longitude based information using WebGL. ](https://github.com/dataarts/webgl-globe) +- [UI component for Globe Data Visualization using ThreeJS/WebGL ](https://github.com/vasturiano/globe.gl) + ### [RSM-Reflective Shadow Map](http://www.klayge.org/material/3_12/GI/rsm.pdf) - [Reflective shadow map experiment with a newer version of three.](https://github.com/lmj01/rsm) @@ -31,6 +38,11 @@ - [perlin noise v2,效果看起来非常舒服](https://codepen.io/vcomics/pen/RwQgXzv) - [Shaky / Jumpy - Camera Interpolation Along Curve](https://discourse.threejs.org/t/shaky-jumpy-camera-interpolation-along-curve/52278/2) - [Extruded tube with holes相机跟着视角变化,钻洞的效果](https://codepen.io/boytchev/pen/poxpGZN) +- [A solution to visualize and explore 3D models in your browser. UI很nice](https://github.com/kovacsv/Online3DViewer) + - 这个项目的学习型很强,很多都是最基本的操作,抽象也很简单,架构也灵活,很少第三方的基础库 + - 封装task的engine/core/taskrunner + - 简单的engine/geometry/octree, + - 因为支持可导入导出数据,内部自己管理了所有的数据结构,对数据也进行了处理,比如拓扑结构的存储等,three.js只是渲染库使用 ## 参考 diff --git a/cg/tools/camera.md b/cg/tools/camera.md index aff09b0..fdd0f60 100644 --- a/cg/tools/camera.md +++ b/cg/tools/camera.md @@ -1,6 +1,5 @@ # Camera - ## 插值 要实现缩放动画并应用插值,修改camera的以下属性值,并逐步更新这些值就形成了动画的缩放 @@ -22,6 +21,28 @@ Dolly-Zoom一般分为两种类型: 实现Dolly-Zoom效果,需要保存开始缩放时物体位置处的frustum高度,然后随着相机的移动,找到新的距离,并调整FOV以保持物体在物体位置处的相同高度,这样就可以实现Dolly-Zoom效果 +## [three.js](https://github.com/mrdoob/three.js/blob/dev/src/math/Matrix4.js) + +函数makePerspective实现的就是[OpenGL的投影矩阵OpenGL Projection Matrix](https://songho.ca/opengl/gl_projectionmatrix.html) + +对称透视投影矩阵 + +```js +// use vertical FOV, side view of symmetric frustum +top / near = tan(theta/2); +right = top * aspect = tan(theta/2) * near * aspect; +// use horizontal FOV, top view of symmetric frustum +right / near = tan(theta/2); +top = right / aspect = tan(theta/2) * near / aspect; +// vertex v[xyz] to screen point s[x,y] +// https://community.khronos.org/t/fovy-or-zoom-value/24950/2 +sx = (2n * v.x)(f - n) / ((right - left)(-2fn)v.z); +sy = (2n * v.y)(f - n) / ((top - bottom)(-2fn)v.z); +``` + +[CombinedCamera的实现](https://github.com/mrdoob/three.js/blob/7f43f4e6ef087cec168fea25bb53591052d5ff12/examples/js/cameras/CombinedCamera.js) + ## 参考 -- [The Dolly Zoom Effect, Explained (And 7 Examples in Movies)](https://whatnerd.com/contra-zoom-film-technique-explained-examples/) \ No newline at end of file +- [The Dolly Zoom Effect, Explained (And 7 Examples in Movies)](https://whatnerd.com/contra-zoom-film-technique-explained-examples/) +- [Field of View - Rectilinear and Fishye Lenses ](https://bobatkins.com/photography/technical/field_of_view.html) diff --git a/cpl/cplusplus.md b/cpl/cplusplus.md index 7bffb78..7ee1d09 100644 --- a/cpl/cplusplus.md +++ b/cpl/cplusplus.md @@ -10,6 +10,12 @@ ## 语言特性 +### 生成代码 + +- [Code generation in C++](https://github.com/cor3ntin/CppInjectionReflection/blob/master/doc.md) + +宏会被code injection 替代 + ### 头文件 未避免头文件多次被编译,C/C++中有两种方法来避免,一种是 header include guards,一种是#pragma once diff --git a/exercises/book-info.md b/exercises/book-info.md index 9e7ee32..9b79ce2 100644 --- a/exercises/book-info.md +++ b/exercises/book-info.md @@ -4,6 +4,11 @@ - [pdf](https://journal.cricaas.com.cn/attached/file/20210517/20210517161953_566.pdf) - [在线英语语法书籍--旋元佑](https://llwslc.github.io/grammar-club/) +## 数论 + +- [[日]远山启《数学女王的邀请--初等数论入门》](https://book.douban.com/subject/35097523/) +- [ G.H.Hardy / Edward M.Wright / Heath-Brown / Joseph H.Silverman《哈代数论(第6版)An Introduction to the Theory of Numbers,6E》](https://book.douban.com/subject/5290474/) + ## 线性代数 - [Serge Lang《linear algebra》](https://book.douban.com/subject/2314300/) diff --git a/index/article.md b/index/article.md index c8e3764..7455813 100644 --- a/index/article.md +++ b/index/article.md @@ -11,6 +11,7 @@ ### [图形学](/cg/graphics.md) - [几何](/cg/geometry.md) +- [相机](/cg/tools/camera.md) - [裁剪](/cg/tools/culling.md) - [网格](/cg/tools/grid.md) - [四元数](/cg/tools/quaternion.md) diff --git a/index/book-info.md b/index/book-info.md index 7fa6268..83b96d3 100644 --- a/index/book-info.md +++ b/index/book-info.md @@ -5,6 +5,13 @@ - [Library Genesis 图书馆创世纪 – 中文 (中国)](https://librarygenesis.net/zh/) - [程序员开发的书籍By Developers, For Developers](https://pragprog.com/) +## 公版 + +- [古登堡计划Project Gutenberg is a library of over 70,000 free eBooks](https://www.gutenberg.org/) +- [国学导航](http://www.guoxue123.com/) +- [漢川草廬--一個文史哲愛好者所建立的正體中文古籍網站--繁体-台湾](http://www.漢川草廬.tw/index.php) +- [中國哲學書電子化計劃](https://ctext.org/zh) + ## reading - [vulkan tutorial](https://vulkan-tutorial.com/) diff --git a/index/standard.md b/index/standard.md index 776382e..1b9ef00 100644 --- a/index/standard.md +++ b/index/standard.md @@ -55,6 +55,13 @@ - [DCMTK](https://dcmtk.org/) - [DCMTK on github](https://github.com/DCMTK/dcmtk) +## [IETF](https://www.ietf.org/) + +### RFC + +- [RFC editor](https://www.rfc-editor.org/) +- [The Syslog Protocol](https://datatracker.ietf.org/doc/html/rfc5424) + ## [ Object Management Group (OMG)](https://www.omg.org/) The Object Management Group® Standards Development Organization (OMG® SDO) is a global, open membership, non-profit consortium.