G
G copied to clipboard
💥 A flexible rendering engine for visualization.
### 🤔 This is a ... - [ ] New feature - [ ] Bug fix - [ ] Site / Document optimization - [ ] TypeScript definition update -...
可以添加一些基础的 PostProcessing 效果,例如目前 Path 边缘未做反走样: 使用类似 FXAA 做统一反走样处理: ```js ``` 效果如下,可以看出通过边缘模糊进行了反走样:
Chrome 94 的一项重大更新就是将之前预览版本实现的 WebGPU 纳入了正式版,Firefox、Safari、Edge 目前在预览版本也可以体验(所有浏览器厂商达成共识不容易): https://developer.chrome.com/blog/new-in-chrome-94/#webgpu 升级后通过在页面中添加 origin trial meta 标签使用。 与此同时,iOS 15 也终于支持了 WebGL2: https://developer.apple.com/documentation/safari-release-notes/safari-15-release-notes#Web-APIs 目前 G 按照 WebGPU -> WebGL2 -> WebGL1 自动降级:https://github.com/antvis/g/issues/851 为了通过 origin trial 使用...
# 问题背景 Filter 可以对图像实现一些后处理效果,例如模糊等。 在 G 中 `shadowBlur` 等效果。 CSS Filter:[https://developer.mozilla.org/en-US/docs/Web/CSS/filter](https://developer.mozilla.org/en-US/docs/Web/CSS/filter) ```css filter: blur(5px); filter: brightness(0.4); filter: contrast(200%); ``` Canvas Filter:[https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/filter](https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/filter) 但是支持度不佳,主要是 Safari 不支持:[https://caniuse.com/mdn-api_canvasrenderingcontext2d_filter](https://caniuse.com/mdn-api_canvasrenderingcontext2d_filter) ```javascript ctx.filter = "blur(5px)"; ``` SVG...
http://g-next.antv.vision/zh/docs/api/basic/display-object#clippath 参考 Oasis 团队的实现,使用 Stencil,仅支持内遮照:https://zhuanlan.zhihu.com/p/394716496 G 之前支持通过 `setClip` 为一个图形设置裁切区域(区域内的部分显示,区域外的隐藏),例如画一张圆形图片。可该属性值可以是任意基础图形,例如 Circle、Rect 等等。  # API 在新版中我们参考 CSS 的 [clip-path](https://developer.mozilla.org/zh-CN/docs/Web/CSS/clip-path)。例如我们想创建一个圆形的图片: ```javascript const image = new Image({ attrs: { x: 100, y:...
材质支持 Phong 模型。希望补充一些常见光源,目前支持: * 环境光 https://g.antv.antgroup.com/api/3d/light#%E7%8E%AF%E5%A2%83%E5%85%89 * 平行光 https://g.antv.antgroup.com/api/3d/light#%E5%B9%B3%E8%A1%8C%E5%85%89 可继续实现点光源和聚光灯。
lineCap 支持以下三个值:  其中 'butt' 不需要做额外处理,'round' 'square' 需要延伸。 但最困难的点是当存在虚线时,lineCap 也需要生效。下图为 Canvas 原生渲染的效果: 
### Desired goals Drag elements inside the canvas out of the canvas. ### The tried and tested method Method 1: When the canvas mousedown event is triggered, create a new...