8
绘制图像作为Voronoi地图
归功于Calvin的兴趣爱好，将我的挑战想法推向正确的方向。 考虑平面中的一组点，我们将其称为site，并将颜色与每个站点关联。现在，您可以使用最接近的站点的颜色为每个点着色，从而绘制整个平面。这称为Voronoi图（或Voronoi图）。原则上，可以为任何距离度量定义Voronoi映射，但是我们将仅使用通常的欧几里德距离r = √(x² + y²)。（注意：您不一定非要知道如何计算和渲染其中之一才能在此挑战中竞争。） 这是一个包含100个站点的示例： 如果查看任何像元，则该像元内的所有点都比相应的地点更近。 您的任务是使用这样的Voronoi贴图来近似给定图像。你给出任何方便的光栅图形格式的图像，以及一个整数ñ。然后，您应该生成最多N个站点，并为每个站点生成一个颜色，以使基于这些站点的Voronoi地图尽可能接近输入图像。 您可以使用此挑战底部的堆栈片段来从输出中渲染Voronoi贴图，也可以根据需要自己渲染。 您可以使用内置函数或第三方函数从一组站点计算Voronoi地图（如果需要）。 这是一次人气竞赛，因此以最多净票数赢得答案。鼓励选民通过以下方式判断答案 原始图像及其颜色的近似程度。 该算法在不同种类的图像上的效果如何。 该算法对小N的效果如何。 该算法是否自适应地对需要更多细节的图像区域中的点进行聚类。 测试影像 这是一些测试您的算法的图像（一些我们通常的怀疑者，一些新的怀疑者）。单击图片查看大图。 第一排的海滩是由奥利维亚·贝尔（Olivia Bell）绘制的，并在她的允许下包括在内。 如果您想要其他挑战，请尝试白色背景的Yoshi并使其腹部正确。 您可以在此imgur画廊中找到所有这些测试图像，您可以在其中将它们下载为zip文件。专辑还包含一个随机的Voronoi图作为另一项测试。作为参考，以下是生成它的数据。 请提供用于各种不同图像和N的示例图，例如100、300、1000、3000（以及适用于某些相应单元格规范的粘贴框）。您可以根据需要在单元格之间使用或忽略黑色边缘（在某些图像上看起来比在其他图像上看起来更好）。但是，不要包括这些网站（当然，在一个单独的示例中，除非您想说明您的网站展示位置如何工作）。 如果要显示大量结果，可以在imgur.com上创建一个图库，以使答案的大小合理。另外，也可以像在参考答案中所做的那样，将缩略图放在您的帖子中，并使其链接到较大的图像。您可以通过s在imgur.com链接（例如I3XrT.png-> I3XrTs.png）后附加文件名来获得小缩略图。另外，如果发现不错的东西，请随时使用其他测试图像。 渲染器 将输出粘贴到以下堆栈片段中以呈现结果。确切的列表格式无关紧要，只要每个单元格由5个浮点数按顺序指定x y r g b，其中x和y是单元格站点的坐标，并且r g b是该范围内的红色，绿色和蓝色通道0 ≤ r, g, b ≤ 1。 该代码段提供了一些选项，用于指定单元格边缘的线宽，以及是否应显示单元格位置（后者主要用于调试目的）。但是请注意，仅当单元格规格更改时才重新渲染输出-因此，如果您修改其他一些选项，请为单元格或其他内容添加一个空格。 显示代码段 function draw() { document.getElementById("output").innerHTML = svg } function drawMap() …