最近一直在做 svg格式的解析和渲染

首先什么是svg ?
在这里插入图片描述

他虽然是图片格式 其实和我们常见的png,jpg是不一样的,这个里面就是xml,描述了一些图形曲线之类的
他有个好处就是矢量图形不会模糊失真等等

如果熟悉 iconfont的 和做过一些设计的 应该知道 这些图标就是 svg 格式
在这里插入图片描述
这个就是一个svg 文件的内容,其实像word excel 等 也是ooxml格式 只不过比这个还要复杂的多的多

在这里插入图片描述

svg 相关的元素和属性也是比较多的 上百种
这个是w3c的官方链接
https://developer.mozilla.org/zh-CN/docs/Web/SVG/Element

简单介绍完 什么是svg, 在说一下这方面c/c++的轮子是真的少的不行

把github 上 5-6个svg相关的解析库全部找到研究了一下,没有一个合适的只能造轮子了!!

这些星star都很少就几百个 , 可能因为没有这方面的需求 所以才没有比较完善的开源库吧
svgpp (接入和维护成本巨大 一个cpp 没有 全部是元编译生成的文件 超级复杂)
lunasvg
nanosvg 都不太合适
libsvgtiny
qt的svg(不合适,我们不依赖qt了和操作系统, 纯c++,因为要编译为wasm 给到浏览器中的js用)

如果自己造轮子 并且兼容性做的比较好 一个人预计需要一年的时间吧。。。(网上有个大佬说的)
在这里插入图片描述

简单说一下思路
后面的实现 就是针对每一个元素实现一个类
抽象出一些图形共性的类作为基类

svgFile -> xml解析 -> 中间层(定义各种对应svg元素的类)-> (接入方-> 翻译层(把中间层转为能渲染的图形))-> 渲染

我们这个模块不依赖任何就是纯原生c++ 实现, 考虑了复用 所以没有耦合

比如 A使用方使用的渲染引擎是skia
B 使用方使用的渲染引擎是XXX
那么他们只需要实现这个翻译层就好(这块也比较复杂,各种图层坐标等等),这样接入会比较方便

目前才做了基本和常见的元素 都100多个文件了,这块如果要做很完善还是很复杂的.
目前像几个浏览器的兼容性都不错 chrome 火狐 ,其他很多设计软件也不行 figma, 即时设计 mastergo 等等
好了不说了

Logo

腾讯云面向开发者汇聚海量精品云计算使用和开发经验,营造开放的云计算技术生态圈。

更多推荐