绘谜的油漆桶工具

[itorr]

绘谜的油漆桶工具做了几次删了几次，逐渐摸索到了现在决定的方案。

首先从画面的像素中找到需要填充的区域，这时需要做的一个麻烦点在于需要能够在有缺口时也能一定程度上的实现填充。
目前反倒是为了性能考虑，用的是深度优先搜索算法。通过一些其他办法实现了有小缺口时依旧可以成功填充对区域。

希望之后能实现 C 型缺口的填充。

然后为了能把这个填充结果固定化，需要把获取到的范围存储下来，一直没有时间找这个方案的算法
前两天浅尝了 AI 生图很有意思，正好问问 ChatGPT

从位图获取矢量的区域程序上应该怎么做

ChatGPT 告诉我

从位图获取矢量区域的程序通常包括以下步骤：

1.加载位图 - 首先，需要从文件系统或其他来源中加载原始位图。可以使用适当的图像处理库（例如OpenCV、Pillow等）来加载和处理位图。
2.选择区域 - 使用算法或人工智能技术（例如边缘检测、分割、机器学习等），选择要转换为矢量形状的区域。这可能涉及到应用一些过滤器和变换，以便更好地识别所需区域。
3.转换为矢量 - 对于每个被选中的区域，需要将其转换为矢量形状。可以使用标准的矢量绘图算法（例如Bezier曲线等）或专门的矢量化算法（例如Potrace等）来执行此操作。这些算法将像素坐标转换为矢量路径，最终生成矢量图像。
4.优化路径 - 生成的矢量路径可能需要进行进一步的编辑和优化，以便更好地匹配原始位图。这可能涉及到应用平滑过滤器、删除冗余锚点等操作。
5.输出 - 最后，将生成的矢量图像存储为所需格式（如SVG、EPS、AI等），并在必要时进行压缩和优化。

需要注意的是，从位图获取矢量区域的程序可能需要结合多种技术和算法，并进行大量参数调整和实验，以获得最佳结果。

这里我最需要的就是 Potrace 这个关键词，接着 我通过这个关键词 找到了 Potrace.js 这个库，对部分代码做了调整，减少重复运行的部分之后，相当棒的实现了油漆桶效果ww