【发布时间】：2014-07-12 04:16:53
【问题描述】：
我正在使用 HTML Canvas 功能创建漂亮的图标。但我刚刚注意到它们都是基于像素的，我的意思是光栅图形，而不是矢量。我更倾向于使用 HTML Canvas 而不是使用 SVG。无论如何，Canvas 的工作方式与 SVG 非常相似。也就是说，它们都服务于由数学方程定义的直线和曲线。所以我想知道是否有办法将这些图像渲染为矢量，或者如果根本不可能进行实时缩放，至少可以将它们预先缩放（例如 2 倍大）。
【问题讨论】：
-
哎哟！您想将数以千计的光栅图像转换为矢量吗？给了解 Illustrator 的图形艺术家带来一张大支票。
-
其实没有。画布功能可让您通过指定坐标、角度、颜色等来生成图像。我只是想知道如果不将它们渲染为矢量，是否有办法让它们在特定时间缩放而不会造成任何质量损失。顺便说一句，我可以使用 Illustrator。
-
好吧，如果您可以访问 Illustrator，您可能还可以访问 Photoshop。如何创建一个调整图像大小的操作（可能是您的 2X），然后使用批处理命令处理文件夹中的每个文件。
-
这不是问题。问题是图像在浏览器上的呈现。不会使用外部图像文件，它们都是代码。
-
您可以在画布上轻松缩放 2 倍，但会损失质量。您可以在 Photoshop 中以最小的质量损失进行 2 倍缩放。您可以将 Illustrator 中的图像转换为矢量，然后进行缩放而不会损失质量。但是不，没有办法将光栅图像渲染为矢量。
标签： javascript html css canvas vector