How to calculate what percentage of a pixel is within the bounds of a shape - graphics

I have a 2d grid where pixel centers are at the intersection of two half-grid lines, as shown below.
I also have a shape that is drawn on this grid. In my case the shape is a glyph, and is described by segments. Each segment has a start point, end point and a number of off-curve points. These segments can be quadratic curves or lines. What's important is that I can know the points and functions that make up the outline of the shape.
The rule for deciding which pixels should be turned on is simple: if the center of the pixel falls within the shape outline, turn that pixel on. The following image shows an example of applying this rule.
Now the problem I'm facing has to do with anti aliasing. What I'd like to do is to calculate what percentage of the area of a given pixel falls within the outline. As an example, in the image above, I've drawn a red square around a pixel that would be about 15% inside the shape.
The purpose of this would be so that I can then turn that pixel on only by 15% and thus get some cleaner edges for the final raster image.
While I was able to find algorithms for determining if a given point falls within a polygon (ray casting), I wasn't able to find anything about this type of problem.
Can someone can point me toward some algorithms to achieve this? Also let me know if I'm going about this problem in the wrong way!

This sounds like an X, Y problem.
You are asking for a way to calculate the perecentage of pixel coverage, but based on your question, it sounds that what you want to do is anti alias a polygon.
If you are working only with single color 2D shapes (i.e red, blue, magenta... squares, lines, curves...) A very simple solution is to create your image and blur the result afterwards.
This will automatically give you a smooth outline and is simple to implement in many languages.

Related

How to calculate overlapping area of a pixel and a line going through it?

I have two endpoint of a line segment. I calculated the pixels to be colored using Mid Point Line algorithm. Now, I want to apply unweighted antialiasing to those pixels which provides the intensity of a pixel based on the area overlapping of that pixel and line.
I am asking for suggestions on how to find out those percentage of overlapping area?
It is not necessary that pixels are to be considered as rectangle only.

Is there a simple algorithm that can find the envelope of several circles?

Given a number of points on a 2d surface and radiuses for these points I can easily paint circles for them. What I need is an algorithm that only paints the envelope (right word for what I am looking for?) or outer bound of these combined circles. Additionally a second set of circles can 'encroach' on these circles, resulting in a kind of 'border'.
Image of what I am looking for
A quick way to draw the outline of the union of the disks is to
fill all disks in yellow, then
fill all disks in white with a smaller radius.
This can be adapted to the "encroached" circles, provided you only fill the remaining portions of the disks. Unfortunately, in a general setting finding the remaining portions can be an uneasy geometric problem.
There is an alternative approach which can work in all cases:
fill an image with zeroes, then for all disks fill every pixel with the value of the distance to the circumference (maximum at the center), but only keep the highest value so far.
while you do this, fill a second image with the color of the disk that achieved that highest value. (Initialize the image with the background color.)
At the end of this process, the first image will represent a "terrain" made of intersecting cones; and for every point of the terrain, you will know the color.
finally, color the pixels that have a height smaller than the desired stroke width, using the color map.
You can do the drawing in two steps.
1) Draw the outline using the following method: For each point, draw a circle using your favorite circle-drawing method, but before drawing a pixel, ensure that it is not contained inside any other circle. Do this for every point and you will get your outline.
2) Draw the borders between different sets using the following method: For each pair of points from different sets, calculate the two intersection points of the circles. If there is an intersection, the border can be drawn as a segment joining these two points. However, you have to make two lines, one for circle A, and another for circle B. To draw the line for circle A, slightly offset the segment towards point A. Then, use your favorite line-drawing method, but before drawing a pixel, ensure that it is closer to point A that any other point of the opposite set. After drawing the line, repeat the process for circle B. Note that both segment are not guaranteed to be the same length since the asymmetry of the points of the different sets. It will, however, always form a closed shape when all outlines and borders are drawn.

Find contour of 2D unorganized pointcloud

I have a set of 2D points, unorganized, and I want to find the "contour" of this set (not the convex hull). I can't use alpha shapes because I have a speed objective (less than 10ms on an average computer).
My first approach was to compute a grid and find the outline squares (squares which have an empty square as a neighbor). So I think I downsized efficiently my numbers of points (from 22000 to 3000 roughly). But I still need to refine this new set.
My question is : how do I find the real outlines points among my green points ?
After a weekend full of reflexions, I may have found a convenient solution.
So we need a grid, we need to fill it with our points, no difficulty here.
We have to decide which squares are considered as "Contour". Our criteria is : at least one empty neighbor and at least 3 non empty neighbors.
We lack connectivity information. So we choose a "Contour" square which as 2 "Contour" neighbors or less. We then pick one of the neighbor. From that, we can start the expansion. We just circle around the current square to find the next "Contour" square, knowing the previous "Contour" squares. Our contour criteria prevent us from a dead end.
We now have vectors of connected squares, and normally if our shape doesn't have a hole, only one vector of connected squares !
Now for each square, we need to find the best point for the contour. We select the one which is farther from the barycenter of our plane. It works for most of the shapes. Another technique is to compute the barycenter of the empty neighbors of the selected square and choose the nearest point.
The red points are the contour of the green one. The technique used is the plane barycenter one.
For a set of 28000 points, this techniques take 8 ms. CGAL's Alpha shapes would take an average 125 ms for 28000 points.
PS : I hope I made myself clear, English is not my mothertongue :s
You really should use the alpha shapes. Maybe use only green points as inputs of the alpha alpha algorithm.

Extrapolation of pixels position

I have an image with some curve draw in it and I want to extrapolate positions of next few pixels based on already drawn ones. An example is shown in figure 1. For this situation it is easy to fit curve (some parabola) using the least square fit (figure 2) and then based on this fit rasterize the curve to find next pixels (I also need the vector curve for some further calculations).
The problem is that there is often situations like one shown in figure 3, where I can't use curves like parabola, because I can't define such function. Have you any idea how to extrapolate curve/pixels which will work in both cases?

Finding a point clicked in a grid

Given this grid ( http://i.stack.imgur.com/Nz39I.jpg is a trapezium/trapezoid, not a square), how do you find the point clicked by the user? I.e. When the user clicks a point in the grid, it should return the coordinates like A1 or D5.
I am trying to write pseudo code for this and I am stuck. Can anyone help me? Thanks!
EDIT: I am still stuck... Does anyone know of any way to find the height of the grid?
If it is a true perspective projection, you can run the click-point through the inverse projection to find it's X,Z coordinates in the 3D world. That grid has regular spacing and you can use simple math to get the A1,D5,etc.
If it's just something you drew, then you'll have to compare the Y coordinates to the positions of the horizontal lines to figure out which row. Then you'll need to check its position (left/right) relative to the angled lines to get the column - for that, you'll need either coordinates of the end-points, or equations for the lines.
Yet another option is to store an identical image where each "square" is flood-filled with a different color. You then check the color of the pixel where the user clicked but in this alternate image. This method assumes that it's a fixed image and is the least flexible.
If you have the coordinates of end points of the grid lines then
Try using the inside-outside test for each grid line and find the position
Since this grid is just a 3D view of a 2D grid plane, there is a projective transform that transforms the coordinates on the grid into coordinates on the 2D plane. To find this transform, it is sufficient to mark 4 different points on the plane (say, the edges), assign them coordinates on the 2D plane and solve the resulting linear equation system.

Resources