Comments (1)
figma 的钢笔工具创建的图形是它自创的矢量网格(vector network)。
感兴趣的话可以看看这两篇文章:
- https://madebyevan.com/figma/introducing-vector-networks/
- https://alexharri.medium.com/the-engineering-behind-figmas-vector-networks-688568e37110
suika 编辑器使用的 传统意义上的路径,效果是和 svg 和 canvas 2d 的 path 一样,上面的图 1 就是 svg 和 canvas 2d 的效果(非零环绕数填充)。
figma 用的是自己定义的填充算法(计算轮廓多边形作为填充区域),所以得到图 2 的效果。关于计算多边形轮廓,我有实现一个简化的算法,感兴趣可以看看:
https://github.com/F-star/polygon-alg
figma 的矢量网格比较复杂,细节非常多,因为个人精力有限,目前 suika 编辑器是不支持的。
后期可能会考虑~
from suika.
Related Issues (20)
- Support drag canvas by mouse wheel
- Refactor graph info panel
- 框选判断碰撞检测逻辑BUG HOT 2
- width height tooltip with selected box
- Support resize mulit graphs
- Support select graphs when draw selection
- Line control handle
- Support import/export
- Add peference menu item
- Pen tool
- 可以添加移动端支持吗 HOT 1
- repalce "x, y, rotation" with "transform"
- 这个vue能用吗 HOT 1
- 钢笔工具绘制的图形在特定情况下调整会变成直线 HOT 1
- 可以实现 gradient, clip-path, pattern, shadow 这些吗 HOT 3
- 绘制工具在拖拽过程中,交替切换 Shift, Space 键,表现不一致 HOT 5
- 垂直标尺文字有点被挤压了 HOT 3
- 合并组选中,旋转的bug HOT 1
- 【通知】为实现多人协同,写后端配套服务去了 HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from suika.