将代码从渲染 SVG 迁移到 Canvas/WebGL - 我有哪些选择?

发布于 2024-11-20 13:47:45 字数 253 浏览 5 评论 0原文

我正在查看一些较旧的代码,这些代码通过生成包含重要 SVG 元素的网页来为网站呈现一些图像、动画等。结果是一个相当复杂的交互式界面。我的任务是迁移应用程序以生成 WebGL 调用。

考虑到 SVG 附带的所有优点,这是一项不简单的任务,如果直接使用 WebGL 实现,这些优点是无法直接使用的。我一直在争论是否应该迁移到使用 Three.js 之类的东西,但对可用选项了解不够,无法做出明智的决定。

当我尝试在这里制定我的战斗计划时,我应该考虑哪些合理的选择?

I'm looking at some older code which is rendering some images, animations, etc... for a website by generating a web page containing significant SVG elements. The result is a fairly complicated, interactive, interface. I've been tasked with migrating the application to instead generate WebGL calls.

This is a non-trivial task, considering all of the niceties that come with SVG, which are not directly available if going straight to a WebGL implementation. I've been debating whether I should pitch migrating to using something like Three.js instead, but don't know enough about the available options to make a good decision.

What are some reasonable options I should consider when trying to build my battle plan here?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

段念尘 2024-11-27 13:47:45

我建议您查看http://code.google.com/p/canvg/作为一个选项。

我假设它使用 getContext("2d") 而不是 getContext("experimental-webgl") 或 getContext("webgl")。

WebGL 提供了 3d 界面,我不确定将其用于 2d 图形是否有任何优势,因为您没有任何 3d 转换可供 GPU 处理。如果他们对 Canvas 感兴趣,而不是专门对 webgl 感兴趣……Canvg 会带来 SVG 的一些优点,这将成为源内容。

如果问题是浏览器不支持 SVG http://code.google.com/p/svgweb / 对解决这个问题有很大帮助。

I would suggest you look at http://code.google.com/p/canvg/ as an option.

I assume it is using getContext("2d") not getContext("experimental-webgl") or getContext("webgl").

WebGL provides a 3d interface and I am not sure if there is any advantage to using it for 2d graphics, since you don't have any 3d transforms for the GPU to work on. If they are interested in Canvas not specifically webgl ... Canvg would bring over some of the niceties of SVG which would be the source content.

If the issue is lack of support for SVG in browsers http://code.google.com/p/svgweb/ goes a long way to solving that problem.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文