还能用 AI 生成 SVG(可缩放矢量图像)?我们来聊聊 SVG

boyanx2个月前技术教程15

文章链接:
https://mp.weixin.qq.com/s/uWu4_yM5wb-eFkBlMBD-TA

什么是 SVG

SVG(Scalable Vector Graphics,可缩放矢量图形)基于 XML 标记语言,用于描述二维图形。与我们常见的位图图像(后缀名 jpg,png 等)不同,SVG 图像本质上是通过文本形式存储对形状的描述,因此其可以缩放到任意大小而不会产生失真或降低质量。让我们通过一个例子来感受一下 SVG 图像的本质。

上图是一个 SVG 图像示例,下面的 XML 代码则对这张 SVG 图像的属性进行了描述










可以看到,这样的一张 SVG 图像就是由这些代码所描述的,其中的每个 都是一条路径。

随着图像领域 AIGC 的飞速发展,我们难免会问,是否可以通过 AIGC 技术来生成 SVG 图像呢?答案是肯定的。接下来,我们将介绍几篇 SVG 图像生成方面的论文。


SVG 图像生成

DeepSVG

作为 SVG 图像生成的早期工作,DeepSVG 选用了与 VAE(Variational Autoencoder,变分自编码器) 类似的架构。但不同的一点是,DeepSVG 使用了分层编码器与分层解码器。

编码器部分分为 , 用来为每条路径生成相应的隐变量,而 则根据所有路径的隐变量生成一个最终的隐变量,作为编码器部分的最终输出。

解码器部分与编码器部分类似,分为 。 接收编码器部分输出的隐变量,都解码出每一条路径的隐变量,而 则是接收每条路径的隐变量,解码出最终结果。

但是,由于 SVG 图像有着路径间无顺序的特点,DeepSVG 使用了一个 来指派这种顺序,具体有字典序和匈牙利算法两种。


Im2Vec

说完了 DeepSVG,我们来看 Im2Vec。很明显,DeepSVG 的训练过程需要 SVG 图像来作为训练数据与监督信号,这并不有利于更大规模的模型的训练。因此,Im2Vec 提出了使用位图来监督 SVG 图像生成的方法。

Im2Vec 的结构如上图所示。位图会首先通过一个 Encoder 得到一个全局的隐变量,然后通过一个 RNN 为每条路径生成一个隐变量和一个深度信息。每条路径的隐变量会通过 PathDecoder 来得到向量化的输出。然后每一部分的向量化输出会经过光栅化转换为位图,并根据深度信息进行叠加,输出重建后的位图。这样一来,便实现了输入和输出均为位图的自监督方法。

PathDecoder 包含两个 1D circular 卷积。首先根据隐变量在圆上均匀采样一些点,第一个卷积来实现自适应密度采样,以调整采样点的密度,实现更多细节;第二个卷积来实现采样点的位移。


ClipGen

ClipGen 则是采用了与 Clip 类似的方法,在生成过程中融入了类别信息。ClipGen 的整体逻辑是自回归式生成,其中 target shape 是可选项。

当前画布会首先通过一个函数以获得曲线信息,曲线信息和类别信息会一起输入到 CNN 中,输出接下来要绘画的内容的概率图,并决定是否增加新图层。如果增加新图层,那么曲线信息、类别信息、概率图会一起输入给下一个 Network,得到新图层的绘画结果,并叠加到原画布上。


StarVector

StarVector 则是使用了 CLIP+CodeLLM 的 MLLM 来生成构成 SVG 图像的代码。

在训练时,位图和对应的 SVG 版本的代码会分别通过 CLIP 和 tokenizer 转换为 token,然后使用 next token prediction 的方法进行训练。

而在推理时,由于输入只有 image 部分,因此输入变为 image 转换为 token,由 CodeLLM 来预测 SVG 代码部分的所有 token,实现输出 SVG 的效果。


SVGDreamer

SVGDreamer 则是使用了文生图的 Diffusion Model 来实现这一过程。首先根据文本提示生成出相应的图片,并根据相应文本 token 得到注意力 heatmap。再根据 heatmap 对控制点、起止点进行采样,并使用 SIVE 损失函数进行优化,最终得到分层的 SVG 图片。

然后对 SVG 图片中的每条路径进行随机选择,并进行光栅化,然后在使用 LoRA 微调原文生图模型的过程中,使用 VPSD 优化对 SVG 图的路径进行优化。

T2V-NPR

T2V-NPR 也是使用了 Diffusion Model,但思路构建上却与 SVGDreamer 不一样。

T2V-NRP 首先构建了一个 VAE 架构的模型,来初步训练 Diffusion,如上图 a 部分。SVG 图会渲染为位图,并提取为隐变量。隐变量会通过两个 Diffusion 以分别生成 SVG 图的重建以及位图的重建。

将第一步中的 SVG Diffusion 拿出来,在第二步中使用 VSD 方法对 SVG 的路径进行优化,这一部分与 SVGDreamer 中的 VPSD 过程是类似的。

最后,SVG 的路径会在第三步中迎来逐层优化,最终得到更好观感的 SVG 图。

参考文献:

[1] DeepSVG,NIPS 2020,https://arxiv.org/abs/2007.11301

[2] Im2Vec, CVPR 2021 Oral, https://arxiv.org/abs/2102.02798

[3] ClipGen, TVCG 2021, https://arxiv.org/abs/2106.04912

[4] StarVector, Arxiv 2023, https://arxiv.org/abs/2312.11556

[5] SVGDreamer, CVPR 2024, https://arxiv.org/abs/2312.16476

[6] T2V-NPR, SIGGRAPH 2024, https://arxiv.org/abs/2405.10317

标签: svg 生成

相关文章

AI驱动的文本矢量图形生成技术,转化为有层次结构的矢量图形!

NeuralSVG是创新的文本驱动矢量图形生成技术。通过一个小型的多层感知器网络,将文本提示转化为具有层次结构的矢量图形。该网络以形状索引为输入,输出形状参数,再经可微染器生成像素输出。基于分数蒸馏采...

Deepseek生成图片的几个方法,示例模板附上

针对DeepSeek生成图片场景设计的原创提示语模板及示例,结合了多步引导、参数化要求和第三方工具协同策略,可适配不同设计需求:一、SVG代码生成法(适用技术型用户)提示语结构:请将下方文本内容转化为...

分享我用AI制作小游戏的过程

小游戏叫《天际飞翔》,实际上是《Flappy Bird》+动态难度+奖励道路+分值记录。后续还打算引入好友排名功能,更多的功能没太想好,主要是尝试下小游戏制作。先列一下使用到的工具:编程软件:Curs...

轻松玩转自定义头像 – 用Multiface打造你的专属形象

从社交媒体平台到专业网络,用户对展示自己个性的方式有着更高的需求。为了满足这种需求,我们开发了一个简单但功能强大的工具——Multiface,它能够为每个用户提供独一无二的自动生成头像。Multifa...

借助云服务快速生成背景图片

大家在做平面设计、编辑文档、设计网页等时经常会用到背景图片,但网上下载的背景图片有时不能满足实际需求,自己动手制作需要较高的美术功底,相关的制作软件也有一定的上手门槛。其实不用这么麻烦,借助一些云服务...

Deepseek 只需2步生成'流程图'方法:附详细步骤

前面几篇文章,阳仔给大家介绍了,如何用Deepseek 接入到word,excel或者wps中提高办公效率,这一期,阳仔给大家介绍一下,如何使用deepseek来辅助生成实用的流程图:以下是几种结合...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。