英文:
Why is a Pixmap circle off by 1?
问题
我正在尝试使用 Pixmap 绘制一个圆。为了更清楚地说明问题,我将整个 Pixmap 区域填充为白色,然后用不同的颜色绘制圆。以下是我认为应该可以工作的代码。
我将 Pixmap 的宽度/高度设置为圆的半径的两倍。
然后我在 Pixmap 的中间绘制一个圆,位于坐标 (radius, radius) 处。
```java
public static Texture circle(int radius, Color color) {
Pixmap pixmap = new Pixmap(radius * 2, radius * 2, Pixmap.Format.RGBA4444);
pixmap.setColor(Color.WHITE);
pixmap.fill();
pixmap.setColor(color);
pixmap.fillCircle(radius, radius, radius);
Texture texture = new Texture(pixmap);
pixmap.dispose();
}
不幸的是,Pixmap 在圆的右侧和底部裁剪了一部分。例如:
如果我在宽度和高度上分别增加 1,那么它看起来就正常了:
我可以随意添加一个额外的像素,但我想了解为什么需要这样做。为什么将圆的半径设置为 X,实际上直径会是 X + 1 呢?
<details>
<summary>英文:</summary>
I'm trying to draw a circle using Pixmap. To make the problem clearer, I'm filling the entire Pixmap area in white, then drawing the circle in a different color. Here is the code that I feel should work.
I'm setting the width/height of the Pixmap to twice the size of the radius of the circle.
Then I'm drawing a circle in the middle of the Pixmap at (radius, radius).
public static Texture circle(int radius, Color color) {
Pixmap pixmap = new Pixmap(radius * 2, radius * 2, Pixmap.Format.RGBA4444);
pixmap.setColor(Color.WHITE);
pixmap.fill();
pixmap.setColor(color);
pixmap.fillCircle(radius, radius, radius);
Texture texture = new Texture(pixmap);
pixmap.dispose();
}
Unfortunately, the Pixmap cuts off the circle on the right and bottom sides. For example:
[![enter image description here][1]][1]
If I increase the size of the Pixmap by 1 in both the width and height, then it looks fine:
[![enter image description here][2]][2]
I can just arbitrarily add an extra pixel but I'd like to understand why this is necessary. Why does setting the radius of the circle to X result in a diameter that is actually X + 1?
[1]: https://i.stack.imgur.com/AJFIP.png
[2]: https://i.stack.imgur.com/2FOQN.png
</details>
# 答案1
**得分**: 2
为了得到你想要的结果,圆的中心位置必须落在两个像素之间,这样在该位置的两侧就有相似数量的整个像素。我猜测 Pixmap 代码定义了像素的位置是指像素的中心。因此,点 `(radius, radius)` 距离右边缘比左边更近,而 `(radius-1, radius-1)` 则比右边缘更靠近左边。基于这种位置定义,你的圆的中心应该位于位置 `(radius-.5, radius-.5)`。
如果你必须将圆的中心放在像素的中间,那么使用位置 `(radius, radius)` 来表示圆是有意义的,并且你需要 Pixmap 的宽度和高度为 `(2*radius + 1, 2*radius+1)`。这样,圆心两侧有相同数量的像素,即 `radius+.5` 个像素。在这种情况下,如果库支持的话,你可能希望绘制半径为 `radius + .5` 的圆。
<details>
<summary>英文:</summary>
To get the result you want, the location of the circle's center would have to fall between two pixels, so that there are a similar number of whole pixels on either side of that location. My guess is that the Pixmap code defines a pixel's location to mean the center of a pixel. So the point `(radius, radius)` is closer to the right edge than the left, and `(radius-1, radius-1)` is closer to the left edge than the right. With this definition of location, the center of your circle should be at location `(radius-.5, radius-.5)`.
If you have to put the center of the circle in the middle of a pixel, then it makes sense that you'd use the location `(radius, radius)` for the circle and that you'd need the width and height of the Pixmap to be `(2*radius + 1, 2*radius+1)`. This way, there are the same number of pixels, `radius+.5` pixels, on either side of the center of the circle. You might at that point want to draw a circle of radius `radius + .5` if the library will take that.
</details>
# 答案2
**得分**: 1
因为它在像素上绘制以像素为中心的圆,而不是在像素之间绘制。
所以实际绘制的圆的半径比传入的半径多1,半径为1的圆绘制如下(数字是此示例中的坐标):
012
0 X
1XCX
2 X
从技术上讲,这个圆的半径是1.5,但现在它的中心在一个像素上(C)。
我猜想这是为了让你能够准确地放置它,因为如果它实际上有一个半径为2,你就无法将中心放在一个像素上。
<details>
<summary>英文:</summary>
Because it draws a circle centered **on** a pixel, not *between* pixels.
So the actual radius of the circle drawn is one more than passed in, a circle with radius 1 is drawn as (numbers are coordinates in this example):
012
0 X
1XCX
2 X
This technically has a radius of 1.5, but now it's centered on a pixel (C).
I am guessing this is to allow you to place it accurately, as if it actually had a radius of 2, you wouldn't be able to place the center on a pixel.
</details>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论