前端西瓜哥

大家好，我是前端西瓜哥。 在协同编辑中，同步用户状态是必不可少的功能。通过感知到其他用户的状态，我们可以有意识地避免操作同一个对象，导致冲突和相互覆盖。 下面我们看看 Fi...

大家好，我是前端西瓜哥。 前段时间将图形编辑器的文字渲染做了下改造。 原来的文字渲染使用的是 Canvas 2d 的 fillText 方法，现在改成了用 opentype...

大家好，我是前端西瓜哥。 我们经常需要将图形放到到特定的矩形容器中，常用的的有两种策略：fit 和 fill。 fit fit，合身、适应、匹配之意。 也有些地方叫做 co...

大家好，我是前端西瓜哥。 今天来看看如何对多边线进行光滑处理。 多边线光滑化，指的是提供一个多边形和圆角半径值，将多边线的角点转换为圆弧，如下图所示。 image-2025...

大家好，我是前端西瓜哥。 今天我们来学习三维渲染。 这里需要选定一个三维渲染引擎，这里选择最流行的 threejs。 threejs 是什么 threejs 是一个 jav...

大家好，我是前端西瓜哥。 最近在给我的开源图形编辑器 suika 做多 page 功能，需要记录每个 page 的视口信息，在切换 page 的时候进行复原。 发现原来的视...

大家好，我是前端西瓜哥。 图形编辑器算是 Web 前端开发领域的其中一个天花板了。 对于功能复杂的图形编辑器，经过迭代多年，几十多模块互相关联，包含各种细碎的业务细节，复杂...

大家好，我是前端西瓜哥。 经常用 pixijs 的小伙伴或许注意到了，在 pixijs 下绘制多边形并使用填充，在很多情况下渲染是正确的，如果多边形是自交的，填充就会有问题...

大家好，我是前端西瓜哥。 圆角矩形，其实就是在矩形的基础上在四个角上加上 4 个圆角。 属性上相比矩形多了名为 cornerRadius 属性。 在 CSS 中，这个属性叫...

大家好，我是前端西瓜哥。 今天讲解钢笔工具的新增锚点，和删除并连接锚点的实现。 新增锚点（insert），指的是在 path 的一条三阶贝塞尔曲线上，基于某个位置使曲线一分...

大家好，我是前端西瓜哥。 之前我们实现了三点求圆的算法，这次我们加一点强度，实现 三点求圆弧 算法。 示例演示 https://codesandbox.io/p/sandb...

大家好，我是前端西瓜哥。 今天我们来学习一个简单平面几何算法。 给出三个点，求出对应的唯一圆形。 示例演示 https://codesandbox.io/p/sandbox...

大家好，我是前端西瓜哥。 之前给我的开源图形编辑器 suika 新增了编组的功能，支持类似 Figma 的组嵌套能力。 为此对图形编辑器的整个底层做了大量的改造工作。 改造...

大家好，我是前端西瓜哥。 前段时间，拓竹出了个新的 3合1 的设备，把 3D打印、激光雕刻、刀切 放到一台机器里，貌似是对标 snapmaker。 虽然本人没用过拓竹的产品...

大家好，我是前端西瓜哥。 之前时不时聊过一些图形编辑器的数据后端持久化的问题，今天我们来稍微展开，专门地聊一聊。 本地到远端的演进 首先我们有个本地图形编辑器，数据保存在本...

大家好，我是前端西瓜哥。 最近有人想学习我开源的 suika 图形编辑器，问我下面的项目结构哪些文件对应什么功能，文件太多看不太懂。 那我就在这里简单展开讲讲，内容很多，建...

大家好，我是前端西瓜哥。 最近尝试做一下周刊，把自己收集的一些觉得比较有意思的图形编辑器相关的文章、工具、资讯等进行推荐，希望对你有所帮助。 fig 文件转 leaferj...

日本回国 2024结束了，在日本呆了10个月后，最终还是回国了，距离刚来也就1年多一点的时间，不算长，目前已经回国2.5个月了，目前在家主要是在整： 英语（目前进度新概念第...