From 20cc132ef4a7e4e9e0c9df576894a0d8f1fcc367 Mon Sep 17 00:00:00 2001 From: lmj01 Date: Fri, 16 Jun 2023 21:28:13 +0800 Subject: [PATCH] update --- babylonjs/component.md | 36 ++++++++++++++++++++++++++++++++++++ babylonjs/dev.md | 23 +++++++++++++++++++++++ babylonjs/index.md | 4 +++- babylonjs/material.md | 17 +++++++++++++++++ babylonjs/mesh.md | 7 +++++++ babylonjs/rendering.md | 32 ++++++++++++++++++++++++++++++++ babylonjs/webgpu.md | 2 ++ books/index.md | 8 +++++++- index/community.md | 7 ++++++- index/computerScience.md | 1 + math/pbr3ed.html | 12 ++++++++++-- web/index.md | 11 ++++++++++- 12 files changed, 154 insertions(+), 6 deletions(-) create mode 100644 babylonjs/component.md create mode 100644 babylonjs/dev.md create mode 100644 babylonjs/material.md create mode 100644 babylonjs/mesh.md create mode 100644 babylonjs/rendering.md create mode 100644 babylonjs/webgpu.md diff --git a/babylonjs/component.md b/babylonjs/component.md new file mode 100644 index 0000000..727dac9 --- /dev/null +++ b/babylonjs/component.md @@ -0,0 +1,36 @@ +# Component + +Babylon的特征之一就是是ECS(Entity-Component-System实体-组件-系统)，其核心是遵循组合优于继承原则。 +以scene场景为单元作为一个实体，每个scene实体包含多个组件。 +这样对scene进行解耦，使得每个模块如layers，post-process模块独立性更强。 + +既然以scene为单元，engine对象也是绑定在scene内部，渲染时不需要通过去调引擎,Mesh对象构造时也是依赖与某个scene的 + +scene与engine是双向的，scene引用engine，engine引用scene +正是因为这种互相引用，方便了业务层面上的相互应用，避免了全局引用 + +自v3.1所有场景对象都继承自Node接口， +```js +/** + * Node is the basic class for all scene objects (Mesh, Light, Camera.) + */ +export class Node implements IBehaviorAware { +} +``` +一般框架中基类会基础事件接口，方便各个部件处理，如three-js中 +```js +class Object3D extends EventDispatcher { +} +``` + +# EventSystem + +使用observable观察者模式 + +## Ammo.js + +Ammo.js 使用Emscripten将 Bullet物理引擎 直接移植到JavaScript + +## Monaco Editor + +monaco基于浏览器，而VSCode基于electron \ No newline at end of file diff --git a/babylonjs/dev.md b/babylonjs/dev.md new file mode 100644 index 0000000..5cfd24b --- /dev/null +++ b/babylonjs/dev.md @@ -0,0 +1,23 @@ + +# dev +先执行 +npm run start +打开packages/tools目录下服务，执行相应的script + +开启playground，依赖npm run start中的服务 +也是tools目录下的一个server，单独开启server:dev模式 + +## tools + +### babylonServer + +### playground + +playground中的代码保存时会存入https://snippet.babylonjs.com/中，返回一个对象，含有snippetIdentifier标识符，用来定位所有的代码内容, +playground中的examples是通过https://babylonjs-newdocs.search.windows.net的一个接口返回文档中的snippet内容 + +snippet服务是一个小server，参考[snippet server reference](https://github.com/BabylonJS/SnippetServerReference/blob/main/index.js) +就是一个读写服务器。 + +### devHost +简单的一个基本场景加载逻辑，通过创建一个scene函数来运行，可以定制scene代码的逻辑 \ No newline at end of file diff --git a/babylonjs/index.md b/babylonjs/index.md index b94b19a..aa2f57f 100644 --- a/babylonjs/index.md +++ b/babylonjs/index.md @@ -1,2 +1,4 @@ +# BabylonJS -[shader](./shader.md) \ No newline at end of file +- [dev](./dev.md) +- [shader](./shader.md) \ No newline at end of file diff --git a/babylonjs/material.md b/babylonjs/material.md new file mode 100644 index 0000000..f963da7 --- /dev/null +++ b/babylonjs/material.md @@ -0,0 +1,17 @@ +# Material + +## Effect +Effect containing vertex and fragment shader that can be executed on an object +```js +class Effect { + constructor() { + this._processingContext = this._engine._getShaderProcessingContext(this._shaderLanguage); + } +} + +``` + +## Node Material + +### NMD(Node Material Decorator) +节点材质装饰器 diff --git a/babylonjs/mesh.md b/babylonjs/mesh.md new file mode 100644 index 0000000..848b277 --- /dev/null +++ b/babylonjs/mesh.md @@ -0,0 +1,7 @@ +# Mesh + +## SubMesh +现代引擎中的一个概念 +A mesh has 1 to n submeshes, which divide its vertex data to n parts. This is useful for many cases (from collision to Octree, to MultiMatrials and co). +babylonjs中符合这样的概念。 +Defines a subdivision inside a mesh diff --git a/babylonjs/rendering.md b/babylonjs/rendering.md new file mode 100644 index 0000000..a41fb82 --- /dev/null +++ b/babylonjs/rendering.md @@ -0,0 +1,32 @@ +# Rendering + +在RenderingManager类中可以看到至少有四个render group + +## RenderingGroup + +# Renderer + +## EdgesRender + +```js +class EdgesRenderer { + constructor() { + if (isWebGPU) { + drawWrapper = new DrawWrapper(engine); + } + } + render() { + // drawWrapper是处理WebGPU的 + if (drawWrapper) { + Shader._setDrawWrapper(drawWrapper); + } + engine.bindBuffers + Shader.bind + engine.drawElementsType + Shader.unbind + } +} +// +``` +大致流程还是标准的数据处理 + diff --git a/babylonjs/webgpu.md b/babylonjs/webgpu.md new file mode 100644 index 0000000..fd68f0a --- /dev/null +++ b/babylonjs/webgpu.md @@ -0,0 +1,2 @@ + +glsl可以编译为webassembly的数据格式 \ No newline at end of file diff --git a/books/index.md b/books/index.md index f0d0a4d..e070317 100644 --- a/books/index.md +++ b/books/index.md @@ -3,5 +3,11 @@ ## online - [Physically Based Rendering](https://www.pbr-book.org/3ed-2018/contents) +- [设计数据密集型应用 - 中文翻译](http://ddia.vonng.com/#/) + - [github](https://github.com/Vonng/ddia) -## \ No newline at end of file +## + +## github resource + +- [A collection of academic papers, articles, and other resources that I plan to read or have read. ](https://github.com/jeffrey-xiao/papers/tree/master) \ No newline at end of file diff --git a/index/community.md b/index/community.md index 48a3d28..ecf5ce9 100644 --- a/index/community.md +++ b/index/community.md @@ -27,4 +27,9 @@ - [AVA (AVA examples Visual Analytics) is a technology framework designed for more convenient visual analytics.](https://github.com/antvis/AVA) - [n8n - Workflow automation tool](https://github.com/n8n-io/n8n) - [Moveable is Draggable, Resizable, Scalable, Rotatable, Warpable, Pinchable, Groupable, Snappable](https://github.com/daybrush/moveable) -- [rrweb refers to 'record and replay the web', which is a tool for recording and replaying users' interactions on the web](https://github.com/rrweb-io/rrweb) \ No newline at end of file +- [rrweb refers to 'record and replay the web', which is a tool for recording and replaying users' interactions on the web](https://github.com/rrweb-io/rrweb) + +## DICOM + +- IODs Information Object Definitions信息对象定义 +- SOPs Service-Object Pairs服务对象配对， \ No newline at end of file diff --git a/index/computerScience.md b/index/computerScience.md index 47211a4..7c48916 100644 --- a/index/computerScience.md +++ b/index/computerScience.md @@ -32,6 +32,7 @@ - [Bgfx](../cg/bgfx.md) - [Iolite a modern,portable game engine with an embedded editor. Completely scriptable in Lua, Free for personal](https://iolite-engine.com/) +- [babylonjs](../babylonjs/index.md) #### threejs diff --git a/math/pbr3ed.html b/math/pbr3ed.html index 8f94cd5..89cf64a 100644 --- a/math/pbr3ed.html +++ b/math/pbr3ed.html @@ -29,8 +29,16 @@

5. Color And Radiometry

  • irradiance
  • radiance
    • -

    5.2.1 XYZ Color

    -

    A remarkable property of the human visual system makes it possible to represent colors for human perception with just three floating-point numbers. The tristimulus theory of color perception says that all visible SPDs can be accurately represented for human observers with three values, \( \mathcal{x}_{\lambda} \), , \( \mathcal{y}_{\lambda} \) and \( \mathcal{z}_{\lambda} \). Given an emissive SPD , these values are computed by integrating its product with the spectral matching curves \(X(\lambda)\), \(Y(\lambda)\), and \(Z(\lambda)\):

    +
    +
    5.2.1 XYZ Color
    +

    A remarkable property of the human visual system makes it possible to represent colors for human perception with just three floating-point numbers. The tristimulus theory of color perception says that all visible SPDs can be accurately represented for human observers with three values, \( \mathcal{x}_{\lambda} \), , \( \mathcal{y}_{\lambda} \) and \( \mathcal{z}_{\lambda} \). Given an emissive SPD , these values are computed by integrating its product with the spectral matching curves \(X(\lambda)\), \(Y(\lambda)\), and \(Z(\lambda)\):

    +
    +
    +
    5.4 Radiometry辐射度学
    +

    radiometry提供了一系列的主意和数学工具来描述light的传播和反射，它是形成渲染算法的基础，radiometry首先引入图形学不是因为物理光的原则，而是作为空间粒子的抽象光属性。

    +

    Radiative transfer辐射传输是radiant energy辐射能量传输的现象研究。辐射传输基于辐射原理和几何光学水平的操作，光的微波属性用来描述光与物体交互时比光的波长要长的。辐射度学与Maxwell经典方程描述了电子场域

    +

    在pbrt中，假设几何光学最需要

    +
    diff --git a/web/index.md b/web/index.md index 7081239..6014714 100644 --- a/web/index.md +++ b/web/index.md @@ -2,4 +2,13 @@ - [CSS](./css.md) - [nginx](./nginx.md) -- [vue](./vue.md) \ No newline at end of file +- [vue](./vue.md) + +## library + +### 引导库 + +- [Intro.js is a lightweight JavaScript library for creating step-by-step and powerful customer onboarding tours](https://introjs.com/) + - [github](https://github.com/usablica/intro.js) +- [Bootstrap Tour](https://bootstraptour.com/) + - [github](https://github.com/sorich87/bootstrap-tour) \ No newline at end of file