如何减少任意SVG路径的坐标数,而又不损失太多精度或任何精度? [英] How do I reduce the coordinate count of an arbitrary SVG path, without losing much or any precision?

查看:253
本文介绍了如何减少任意SVG路径的坐标数,而又不损失太多精度或任何精度?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在网上搜索工具,程序,实用程序,支持库和代码原语,这些工具,程序和实用程序最近可以帮助优化SVG的简洁性,空间性和美观性,以链接到

I am scouring the web for tools, programs, utilities, supporting libraries and code primitives that help optimize SVGs for simplicity, space and elegance recently, to link to from the Kilobyte SVG Challenge's tools section, but have yet to find good primitives focusing on how to reduce the number of coordinates of a path, without losing much – or ideally any – precision.

例如,使用可口可乐徽标的标记增强版本(〜7kb,基本上是所有路径数据)–这非常清楚地表明了减少数据的很多希望它的贝塞尔系数的数量,并提供了一些工具来进行数学运算,以使用更少的节点得出一条路径,同时产生基本相同的曲线.

Take this marker-augmented version of the Coca Cola logo, for instance (~7kb, essentially all path data) – which very clearly shows lots of promise for reducing its number of bèziers, given some tooling to do the math to come up with a path using fewer nodes, while producing essentially the same curve.

对于更简单的多边形和折线问题(请阅读全线路径"),可以使用道格拉斯-皮克(Douglas–Peucker)或维斯瓦林厄姆(Visvalingam)的算法(请参见

For the much simpler problem of polygons and polylines (read "all-line paths"), you can use the Douglas–Peucker or Visvalingam’s algorithm (see Mike Bostock's excellent d3 implementation of the latter) to simply remove the coordinates least affecting the path's shape until you're happy with a size-to-precision fit suiting your needs.

我正在寻找一种等效方法,该方法可以注意到较大的曲线(甚至弧形)线段可以在不进行大量手动调整的情况下替换大量这些多余的中间曲线坐标挡块.我认为某些矢量图形包(Adobe Illustrator,甚至是Inkscape?)可能提供此类功能(欢迎访问提示!)-尽管我很乐意找到我们可以推荐的脚本化工具,并提供如何从中使用的HOWTO.命令行或什至是Web应用程序,这些代码会为人们挤出多余的路径填充材料.

I am looking for the equivalent that notices where larger curve (or even arc) segments could replace lots of these redundant mid-curve coordinate stops, without lots of manual tweaking. I think some vector graphics packages (Adobe Illustrator, maybe even Inkscape?) may offer features like these (tips on how to access them welcome!) - though I would love to find scriptable tools we can recommend and offer HOWTOs of how to use from the command line, or even web apps, that squeeze out excess path filler material for people.

作为参考,千字节SVG挑战是我设置的一个有趣的SVG教育和倡导特技,最近.最好在此处和/或在上面链接的github存储库中进行所有关于它的非问题主题的讨论.保持好状况! :)

For reference, the Kilobyte SVG Challenge is a for-fun SVG education and advocacy stunt I have set up, recently. All non-question-topic discussion about it are best held there, and/or on its github repository linked above. Stay awesome! :)

推荐答案

您可以使用 Ramer–Douglas–Peucker算法,可简化折线或多边形路径.

You can use Ramer–Douglas–Peucker algorithm to simplify polylines or polygons path.

这篇关于如何减少任意SVG路径的坐标数,而又不损失太多精度或任何精度?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆