【问题标题】:How to reduce the number of points in bezier curve paths如何减少贝塞尔曲线路径中的点数
【发布时间】:2015-12-27 07:50:14
【问题描述】:

我有一个大的 svg 路径,它有二次贝塞尔曲线。 路径数据用于绘制地图。 如何在不扭曲整体形状的情况下减少贝塞尔曲线的点数?

【问题讨论】:

  • Inkscape 有一个明确用于路径简化的工具(Alt-P > Simplify,或者只是 Ctrl-L),但是 - 请注意,有些行会以 more(不是更少)控制点,但是 - 对线使用更简单的方程仍然意味着具有更多控制点的线可以更快地绘制。另一种需要考虑的方法是 MipMapping——即使用几个不同大小的相同位图图像,根据显示区域的大小选择显示哪一个。 :) Inkscape 可以在这里下载:inkscape.org/en/download

标签: javascript svg


【解决方案1】:

您不会说是要离线(预先准备好的路径)还是在线(即时)执行此操作。如果离线没问题,请使用 Inkscape 之类的工具。

如果您想自己计算简化曲线,那么用于执行此操作的典型算法也与用于绘制贝塞尔曲线的算法相同。该算法称为“扁平化”。

基本上,这个想法是将贝塞尔曲线转换为一系列直线段。因为您不希望看到线段的平坦度,所以您必须考虑绘图的比例以及贝塞尔曲线的弯曲程度。如果贝塞尔曲线非常弯曲,则必须使用比相当笔直时更多的线段。

您通常会使用 De Casteljau 算法将每个贝塞尔曲线一分为二。然后查看两条半贝塞尔曲线中的每一条。如果贝塞尔曲线足够直,可以满足您决定的平坦度限制,则停止划分。否则,分成两半再试一次。

在该过程结束时,您应该得到一条与贝塞尔曲线没有区别的折线。或者,如果您使用比这更粗略的“平面度测试”,您将获得更粗略的形状近似值。在你的情况下是一张地图。

如果您在 Google 上搜索 bezier flattening,您可以找到许多关于该技术的论文。还有几页描述了如何以更友好的访问方式进行操作。例如这个是关于生成偏移曲线的,但首先描述了如何使曲线变平:

https://seant23.wordpress.com/2010/11/12/offset-bezier-curves/

【讨论】:

    猜你喜欢
    • 2021-09-10
    • 2011-02-26
    • 2015-08-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-05-24
    • 1970-01-01
    相关资源
    最近更新 更多