From 406783424bea864a27de5b03e0ae41dc09021402 Mon Sep 17 00:00:00 2001 From: lmj01 Date: Fri, 29 Mar 2024 17:31:54 +0800 Subject: [PATCH] update --- articles/2023/smile.md | 9 ++++++++- articles/2024/app.md | 15 ++++++++++++++- cg/canvas.md | 27 +++++++++++++++++++++++++++ cg/space.md | 2 -- cg/webgl.md | 8 -------- database/sql.md | 7 ++++++- 6 files changed, 55 insertions(+), 13 deletions(-) delete mode 100644 cg/space.md delete mode 100644 cg/webgl.md diff --git a/articles/2023/smile.md b/articles/2023/smile.md index 7f1f20f..593fcc9 100644 --- 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/) \ No newline at end of file +- [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/) \ No newline at end of file diff --git a/articles/2024/app.md b/articles/2024/app.md index cfbf61a..40963b7 100644 --- a/articles/2024/app.md +++ b/articles/2024/app.md @@ -24,4 +24,17 @@ Electron面向纯前端开发者 - 一是立方体要事先准备，使用人员通常没有临时设计和改造立方体的能力，一旦有新的分析需求则必须重建立方体； - 二是立方体上可实施的分析动作单调，只有钻取、聚合、切片、旋转等少数几种，难以完成多步骤的复杂计算行为。 -由数据配合业务来驱动模型，就是预设计好的模型，不太适合某些情况，在某些情况下excel在一定程度上具备某种分析能力，但是excel不适合大数据处理。 \ No newline at end of file +由数据配合业务来驱动模型，就是预设计好的模型，不太适合某些情况，在某些情况下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 index 9e3d505..4f20170 100644 --- 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) \ No newline at end of file diff --git a/cg/space.md b/cg/space.md deleted file mode 100644 index 23ed74a..0000000 --- a/cg/space.md +++ /dev/null @@ -1,2 +0,0 @@ -# 坐标系 - diff --git a/cg/webgl.md b/cg/webgl.md deleted file mode 100644 index eef4ceb..0000000 --- a/cg/webgl.md +++ /dev/null @@ -1,8 +0,0 @@ -# Webgl - -## 硬件问题 - -chrome://flags/中找到Choose ANGLE graphics backend,由OpenGL改成D3D11，原因是可能是D3D9的实现，这样可能不支持WebGL2.0 - -Choose ANGLE graphics backend - diff --git a/database/sql.md b/database/sql.md index 51e90a1..758cf2c 100644 --- a/database/sql.md +++ b/database/sql.md @@ -16,4 +16,9 @@ SQL语言与其他语言区别最明显的特征是执行的顺序 10. order by 以上每个步骤在查询中没有对应的语句会自动跳过， 每个步骤会产生一个虚拟表，该虚拟表被用作下一个步骤的输入，这些虚拟表只有最后一步生成的表才会返回给调用者，其他虚拟表对外部调用sql来说都不可见 -但SQL不是对所有数据和逻辑都适合，SQL缺乏离散型，导致集合化不彻底，有序运算困难，根本的困难是来源于其理论基础，关系代数。 \ No newline at end of file +但SQL不是对所有数据和逻辑都适合，SQL缺乏离散型，导致集合化不彻底，有序运算困难，根本的困难是来源于其理论基础，关系代数。 + +## 关联查询 +是所有SQL的瓶颈，特别是多表多字段的业务逻辑查询 + +