将矢量四舍五入以保持在一个圆圈内有问题吗?
Issue with rounding a vector to stay within a circle?
我正在从圆圈创建基于图块的地图。我想在圆的边缘添加一些特征,我目前正在通过比较向量的长度并检查它是否小于圆的半径来实现。
然而,在从任何特定对角线方向舍入距离时似乎存在一个小错误。
我已经在提供的图像上标记了代码为表达式 if(distance < size)
输出的每个位置。绿点是预期的,我认为是圆的边缘 - 红色的是额外的,不是预期的。
我最好的猜测是这是一个受对角线长度影响的舍入误差。因此,我已经尝试通过使用 Math.Floor 和 Math.Ceiling 舍入来更改 'distance' 变量的舍入方式,但遗憾的是结果没有变化。
// i, j is any particular position on the map, can be negative or positive
var x = i;
var y = j;
var v = new Vector2(x, y);
var distance = (int)v.Length();
var size = diameter / 2;
if (distance <= size)
{
if (distance == size)
{
// green point on image
}
else
{
// inside the green circle on image
}
}
预期的结果是它只给出所提供图像上的绿色像素作为正确的边缘。
包含错误简要概述的图片:
包含错误的图片:
我认为你反对沿边缘的双像素。
TL;DR: 使用圆方程在每个八分圆中直接从 x(或 x 从 y)计算 y,以防止每行/列中有多个像素。
我认为您的期望来自于看到 Midpoint circle algorithm 的光栅化技术,它设法绘制没有令人反感的双像素的圆圈。
它将圆分成 8 个部分,称为 octants。在第一象限(x 和 y 均为正值)中,它分为 x > y 的第一个八分圆和 y < x 的第二个八分圆。这里:一张图片胜过一千个单词。 此图摘自Wikipedia.
细节我就不多说了,只是说一下,在第一个八分圆中,每行只有一个像素,在第二个八分圆中,只有一个像素在每一列中。 我认为这是你的 objective -- 实现相同的目标。
要在第二个八分圆中执行此操作,对于给定的列 x,您可以计算给定半径的圆的 唯一 对应的 y。当然,您需要有一个 if 条件来处理各种八分圆的情况,因为在第一个八分圆中,您需要为给定的 y 计算唯一的 x。 (圆圈是高度对称的;所有情况稍微聪明一点也不错。我将尝试在下面的代码中以一种直截了当的方式这样做。)
基本上,如果您可以对网格中的每个 dx,dy 对执行检查。如果 dy 与你从圆方程计算出的 dy 相同,那么你就可以点亮它。您只需要注意您所在的八分圆,以确保每个 row/column.
不会获得多个像素
深入实施之前的最后一件事。您可能需要一个以 ~.5 结尾的半径,因为具有精确整数直径的圆在 tippy-top 处有一个杂散像素,这很丑陋。您可以使用 ~.5 半径,或者将中心放在 ~.5 坐标处——两者之一;由你决定。在我的示例中,我将 0.5 添加到半径。您可以根据需要制定这些小细节。
代码如下:
static void DrawCircle(int[,] grid, int cx, int cy, int radius) {
int width = grid.GetLength(0);
int height = grid.GetLength(1);
int radius_squared = (int)(((double)radius + 0.5)*((double)radius + 0.5));
for (int y = 0; y < height; ++y)
{
for (int x = 0; x < width; ++x)
{
int dx = x - cx;
int dy = y - cy;
// These three conditions transform all 8 octants into the same octant,
// where dx and dy are positive and dx <= dy, so they can all be
// handled with the same calculation.
if (dx < 0) dx = -dx;
if (dy < 0) dy = -dy;
if (dy < dx)
{
// swap dx and dy
int temp = dx;
dx = dy;
dy = temp;
}
// This now represents "2nd octant" in the picture I provided.
// directly compute the dy value of the edge of the circle given dx.
int edgedy = (int)Math.Sqrt(radius_squared - dx * dx);
// Put a 1 in the cell if it's on the edge, else put a 0.
// You can modify this as needed, of course.
grid[x, y] = (dy == edgedy) ? 1 : 0;
}
}
}
结果:
我正在从圆圈创建基于图块的地图。我想在圆的边缘添加一些特征,我目前正在通过比较向量的长度并检查它是否小于圆的半径来实现。
然而,在从任何特定对角线方向舍入距离时似乎存在一个小错误。
我已经在提供的图像上标记了代码为表达式 if(distance < size)
输出的每个位置。绿点是预期的,我认为是圆的边缘 - 红色的是额外的,不是预期的。
我最好的猜测是这是一个受对角线长度影响的舍入误差。因此,我已经尝试通过使用 Math.Floor 和 Math.Ceiling 舍入来更改 'distance' 变量的舍入方式,但遗憾的是结果没有变化。
// i, j is any particular position on the map, can be negative or positive
var x = i;
var y = j;
var v = new Vector2(x, y);
var distance = (int)v.Length();
var size = diameter / 2;
if (distance <= size)
{
if (distance == size)
{
// green point on image
}
else
{
// inside the green circle on image
}
}
预期的结果是它只给出所提供图像上的绿色像素作为正确的边缘。
包含错误简要概述的图片:
包含错误的图片:
我认为你反对沿边缘的双像素。
TL;DR: 使用圆方程在每个八分圆中直接从 x(或 x 从 y)计算 y,以防止每行/列中有多个像素。
我认为您的期望来自于看到 Midpoint circle algorithm 的光栅化技术,它设法绘制没有令人反感的双像素的圆圈。
它将圆分成 8 个部分,称为 octants。在第一象限(x 和 y 均为正值)中,它分为 x > y 的第一个八分圆和 y < x 的第二个八分圆。这里:一张图片胜过一千个单词。 此图摘自Wikipedia.
细节我就不多说了,只是说一下,在第一个八分圆中,每行只有一个像素,在第二个八分圆中,只有一个像素在每一列中。 我认为这是你的 objective -- 实现相同的目标。
要在第二个八分圆中执行此操作,对于给定的列 x,您可以计算给定半径的圆的 唯一 对应的 y。当然,您需要有一个 if 条件来处理各种八分圆的情况,因为在第一个八分圆中,您需要为给定的 y 计算唯一的 x。 (圆圈是高度对称的;所有情况稍微聪明一点也不错。我将尝试在下面的代码中以一种直截了当的方式这样做。)
基本上,如果您可以对网格中的每个 dx,dy 对执行检查。如果 dy 与你从圆方程计算出的 dy 相同,那么你就可以点亮它。您只需要注意您所在的八分圆,以确保每个 row/column.
不会获得多个像素深入实施之前的最后一件事。您可能需要一个以 ~.5 结尾的半径,因为具有精确整数直径的圆在 tippy-top 处有一个杂散像素,这很丑陋。您可以使用 ~.5 半径,或者将中心放在 ~.5 坐标处——两者之一;由你决定。在我的示例中,我将 0.5 添加到半径。您可以根据需要制定这些小细节。
代码如下:
static void DrawCircle(int[,] grid, int cx, int cy, int radius) {
int width = grid.GetLength(0);
int height = grid.GetLength(1);
int radius_squared = (int)(((double)radius + 0.5)*((double)radius + 0.5));
for (int y = 0; y < height; ++y)
{
for (int x = 0; x < width; ++x)
{
int dx = x - cx;
int dy = y - cy;
// These three conditions transform all 8 octants into the same octant,
// where dx and dy are positive and dx <= dy, so they can all be
// handled with the same calculation.
if (dx < 0) dx = -dx;
if (dy < 0) dy = -dy;
if (dy < dx)
{
// swap dx and dy
int temp = dx;
dx = dy;
dy = temp;
}
// This now represents "2nd octant" in the picture I provided.
// directly compute the dy value of the edge of the circle given dx.
int edgedy = (int)Math.Sqrt(radius_squared - dx * dx);
// Put a 1 in the cell if it's on the edge, else put a 0.
// You can modify this as needed, of course.
grid[x, y] = (dy == edgedy) ? 1 : 0;
}
}
}
结果: