We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
对于非浏览器环境,不存在 window.raf 的情况下,提供创建画布时传入的方式。 但不应该在全局范围内 patch,还是应该放在 Canvas 上。
window.raf
理由是我们的 Canvas 对位到 window,在多个 Canvas 存在的场景下,前一个销毁不会影响到后一个使用。
window
export interface ICanvas extends IEventTarget { devicePixelRatio: number; requestAnimationFrame: (callback: FrameRequestCallback) => number; cancelAnimationFrame: (handle: number) => void; }
另外考虑到小程序环境(深感这种非标准环境就跟曾经的 IE 一样,不想着朝标准靠拢,却总要使用者适配),需要在 Canvas 初始化参数上新增,让 window.requestAnimationFrame / devicePixelRatio / Image / TouchEvent / PointerEvent 这些都能正常使用。
window.requestAnimationFrame / devicePixelRatio / Image / TouchEvent / PointerEvent
我们原本也使用了和 hammer.js 中一致的方法,来判断当前环境是否支持 Touch / PointerEvent,这会影响到事件系统如何格式化传入的原生事件,以及触发何种标准事件,例如如果检测到环境不支持 TouchEvent,系统就不会触发 touchstart 等减少传播处理。本身 globalThis 这样的标准属性就是为了减少对于 global / window / self 的判断,但在小程序这样的环境中完全无法使用:
touchstart
global / window / self
export const SUPPORT_TOUCH = 'ontouchstart' in globalThis; export const SUPPORT_POINTER_EVENTS = !!globalThis.PointerEvent;
解决方案是在 Canvas 上提供一系列 limits 方法,例如是否支持 PointerEvent,默认使用者不传则使用 globalThis 判断,传则覆盖(例如小程序环境需要告知是否支持,以及如何判断一个原生交互事件是哪一类):
globalThis
interface CanvasConfig { supportPointerEvent?: () => boolean; supportMouseEvent?: () => boolean; supportTouchEvent?: () => boolean; isTouchEvent: (event: InteractivePointerEvent) => event is TouchEvent; isMouseEvent: (event: InteractivePointerEvent) => event is MouseEvent; }
The text was updated successfully, but these errors were encountered:
fix: put raf/cancelRaf to Canvas #953
d348244
fix: add limits query such as to Canvas #953
144cdf5
CSS API(CSS Typed OM, CSS Layout API) (#943)
dd3b6e3
* fix: test whether native event came from context's dom element #928 * fix: add offscreenCanvas in Canvas config #940 * feat: add CSS API, includes CSS Typed OM & Layout API * fix: add shadow for Line / Polyline / Path #959 * feat: add for multiple-layer picking #948 * fix: put raf/cancelRaf to Canvas #953 * fix: add limits query such as to Canvas #953 * fix: account for 'none' value in <color> #952 * feat: support multi-layer picking in g-webgl #948 * fix: support when picking in g-webgl #952 * feat: support inheritance in style system * fix: encode html entity in g-svg #963 * feat: add get/setLocalMatrix for legacy G4.0 * fix: animations example * feat: add pointerEvents property #942 * fix: skip number2string when parsing number * Publish - @antv/g-canvas@1.0.20 - @antv/g-components@1.0.18 - @antv/g-devtool@0.3.4 - @antv/g-math@1.0.18 - @antv/g-mobile-canvas@0.0.2 - @antv/g-mobile-svg@0.0.2 - @antv/g-mobile-webgl@0.0.2 - @antv/g-mobile@1.0.5 - @antv/g-plugin-3d@1.0.22 - @antv/g-plugin-box2d@1.0.11 - @antv/g-plugin-canvas-picker@1.0.18 - @antv/g-plugin-canvas-renderer@1.0.18 - @antv/g-plugin-control@1.0.19 - @antv/g-plugin-css-select@1.0.18 - @antv/g-plugin-dom-interaction@1.0.18 - @antv/g-plugin-gpgpu@1.0.19 - @antv/g-plugin-html-renderer@1.0.19 - @antv/g-plugin-matterjs@1.0.8 - @antv/g-plugin-mobile-interaction@0.0.7 - @antv/g-plugin-physx@1.0.11 - @antv/g-plugin-svg-picker@1.0.18 - @antv/g-plugin-svg-renderer@1.0.18 - @antv/g-plugin-webgl-renderer@1.0.24 - @antv/g-plugin-yoga@1.0.8 - @antv/g-shader-components@1.0.16 - @antv/g-svg@1.0.18 - @antv/g-web-component@1.0.5 - @antv/g-webgl@1.0.24 - @antv/g-webgpu-compiler@1.0.19 - @antv/g@5.0.21 - @antv/react-g@1.0.14 - @antv/g-site@1.0.24 * publish Co-authored-by: yuqi.pyq <yuqi.pyq@antgroup.com>
xiaoiver
No branches or pull requests
对于非浏览器环境,不存在
window.raf
的情况下,提供创建画布时传入的方式。但不应该在全局范围内 patch,还是应该放在 Canvas 上。
理由是我们的 Canvas 对位到
window
,在多个 Canvas 存在的场景下,前一个销毁不会影响到后一个使用。另外考虑到小程序环境(深感这种非标准环境就跟曾经的 IE 一样,不想着朝标准靠拢,却总要使用者适配),需要在 Canvas 初始化参数上新增,让
window.requestAnimationFrame / devicePixelRatio / Image / TouchEvent / PointerEvent
这些都能正常使用。我们原本也使用了和 hammer.js 中一致的方法,来判断当前环境是否支持 Touch / PointerEvent,这会影响到事件系统如何格式化传入的原生事件,以及触发何种标准事件,例如如果检测到环境不支持 TouchEvent,系统就不会触发
touchstart
等减少传播处理。本身 globalThis 这样的标准属性就是为了减少对于global / window / self
的判断,但在小程序这样的环境中完全无法使用:解决方案是在 Canvas 上提供一系列 limits 方法,例如是否支持 PointerEvent,默认使用者不传则使用
globalThis
判断,传则覆盖(例如小程序环境需要告知是否支持,以及如何判断一个原生交互事件是哪一类):The text was updated successfully, but these errors were encountered: