update

lmj01 · Mar 29, 2024 · 4067834 · 4067834
1 parent b371187
commit 4067834
Show file tree

Hide file tree

Showing 6 changed files with 55 additions and 13 deletions.
diff --git a/articles/2023/smile.md b/articles/2023/smile.md
@@ -82,6 +82,11 @@ y轴方向上的调整,
 
 使用二次曲线来拟合切缘曲线
 
+## 交互
+
+### 放大镜
+笑窗调整曲线的关键点时，
+
 ## 问题
 
 ### 至2024-2-26
@@ -116,4 +121,6 @@ y轴方向上的调整,
 - [临时网页内容](https://www.sohu.com/a/205746991_377312)
 - [catmull](https://github.com/actionnick/cat-rom-spline)
 - [gl-vec2](https://github.com/stackgl/gl-vec2)
-- [ffmpeg.wasm把视频导出的问题](https://ffmpegwasm.netlify.app/)
+- [ffmpeg.wasm把视频导出的问题](https://ffmpegwasm.netlify.app/)
+- [SmileFy is the Smile Design solution](https://smilefy.com/)
+- [Smile Creator – exocad’s innovative in-CAD smile design solution for predictable esthetic smile makeovers](https://exocad.com/our-products/exocad-dentalcad/smile-creator/)
diff --git a/articles/2024/app.md b/articles/2024/app.md
@@ -24,4 +24,17 @@ Electron面向纯前端开发者
 - 一是立方体要事先准备，使用人员通常没有临时设计和改造立方体的能力，一旦有新的分析需求则必须重建立方体；
 - 二是立方体上可实施的分析动作单调，只有钻取、聚合、切片、旋转等少数几种，难以完成多步骤的复杂计算行为。
 
-由数据配合业务来驱动模型，就是预设计好的模型，不太适合某些情况，在某些情况下excel在一定程度上具备某种分析能力，但是excel不适合大数据处理。
+由数据配合业务来驱动模型，就是预设计好的模型，不太适合某些情况，在某些情况下excel在一定程度上具备某种分析能力，但是excel不适合大数据处理。
+
+## 放大镜Loupe
+
+对图片放大本质就是截取一种部分图片数据来显示
+- [Loupe.js allows you to add photorealistic loupes (magnifier) to images on your webpages. ](https://sprayhank.github.io/CVI/loupe/")这个使用canvas来实现，是因为它们需要一个更酷的效果,但是这个使用了两张图片来实现更酷的效果，这也是为什么需要两个canvas的原因
+- [Loupe demo (mouse over the image)](https://nishanths.github.io/loupe-js/)这个实现简单些，利用css背景截图来实现的部分效果
+- 游戏中也有放大的功能
+    1. 实现倍镜，就是利用渲染区域的变化来控制，实现必须是perspective camera来投影渲染。是整块视图都改变了 
+    2. 用两个摄像机，主相机不变，副相机渲染成一张RenderTexture，并将这种RenderTexture赋值给MirrorObject对象上,MirrorObject对副相机不可见
+
+如果是image，好处理一些，image是固定的。但现在状况是canvas时，就会出现问题。
+canvas没有scale时与image一样，一旦scale后的处理就麻烦了。
+
diff --git a/cg/canvas.md b/cg/canvas.md
@@ -20,6 +20,17 @@
         - 显示器分辨率，由操作系统设定的，
     - 图像分辨率，单位英寸中所包含的像素总数
 
+### 适配
+适配高清屏幕
+```js
+let dpr = window.devicePixelRatio;
+let width = 100, height = 100;
+canvas.width = width * dpr;
+canvas.height = height * dpr;
+canvas.style.width = `${width}px`;
+canvas.style.height = `${height}px`;
+```
+
 
 ## 元素信息
 
@@ -62,6 +73,22 @@ CanvasRenderingContext2D.isPointInPath()
 [A Standard Default Color Space for the Internet - sRGB](https://www.w3.org/Graphics/Color/sRGB.html)
 [CSS Color Module Level 3](https://www.w3.org/TR/css-color-3/#rgb-color)
 
+### 坐标系
+
+左上角为原点，横轴向右是X正轴， 竖轴向下是Y正轴
+
+```js
+const ctx = canvas.getContent('2d');
+// 以中心点center缩放scale系数
+ctx.translate(center.x, center.y);
+ctx.scale(scale, scale);
+ctx.translate(-center.x, -center.y);
+```
+
+目标坐标 = 屏幕坐标（点击产生） + （图形坐标（所求图形） - 屏幕坐标） x 缩放倍数
+
+如果canvas没有缩放超出视口范围，都好处理
+
 ## 参考
 
 - [OffscreenCanvas-离屏canvas使用说明](https://zhuanlan.zhihu.com/p/100375855)
diff --git a/cg/space.md b/cg/space.md
diff --git a/cg/webgl.md b/cg/webgl.md
diff --git a/database/sql.md b/database/sql.md
@@ -16,4 +16,9 @@ SQL语言与其他语言区别最明显的特征是执行的顺序
 10. order by <order_by_list>
 以上每个步骤在查询中没有对应的语句会自动跳过， 每个步骤会产生一个虚拟表，该虚拟表被用作下一个步骤的输入，这些虚拟表只有最后一步生成的表才会返回给调用者，其他虚拟表对外部调用sql来说都不可见
 
-但SQL不是对所有数据和逻辑都适合，SQL缺乏离散型，导致集合化不彻底，有序运算困难，根本的困难是来源于其理论基础，关系代数。
+但SQL不是对所有数据和逻辑都适合，SQL缺乏离散型，导致集合化不彻底，有序运算困难，根本的困难是来源于其理论基础，关系代数。
+
+## 关联查询
+是所有SQL的瓶颈，特别是多表多字段的业务逻辑查询
+
+