Contour graphing algorithm

151 Views Asked by At

I am not sure if this belongs on Mathematics Stack Exchange, but it is somewhat relevant here.

The Problem
If you've installed any graphing/plotting apps on your smartphone, you will notice that the app will only take the equation in form of a single variable for 2D (e.g $y=f(x)$) or in 2 variables for a 3D plot (e.g $z=f(x,y)$). This is problematic as many equations are tough to reduce to the form of $y=f(x)$ or $z=f(x,y)$.
The plotters like this because this is the only way they can plot it in form of lines connecting multiple points. These plotters compute the $y$ value at fixed intervals of $x$ and join the point to the previous one.
The brute force approach to counter this is to check if the function satisfies it at each point on the image. The problem is that this not only takes more time, but gives discontinuous graph for the function as the image cannot have infinite resolution.

The Question
The only way to fix this is to identify which point comes after the next in the plot and join them together by a line. That is where I am stuck. How do you identify which point is sequentially the next one for a given function? Keep in mind that for a human, this might be very easy to do. But, for a computer, this requires a general algorithm. Any ideas?

1

There are 1 best solutions below

1
On BEST ANSWER

Here is a sketch of a common algorithm. While basic, there are some obvious ways to improve it. For concreteness sake, suppose we wish to plot the contour $f(x,y)=0$, where $$f(x,y) = x^3 - x y + y^4.$$ Let us start with a rectangular grid in the plane. Something like so:

enter image description here

This particular grid is $10\times10$ and lives in the square $[-1,1]\times[-1,1]$. The highlighted sub-square is $[-0.4,-0.2]\times[0,0.2]$ and, it just so happens, that the contour passes through this sub-square. To figure out what the contour looks like as it passes through this sub-square, we examine the values of $f$ at the vertices as shown here:

enter image description here

Note that at the lower left, the value of the function is negative while at upper left, the value is positive. Thus, the contour must cross the edge between these two points. It probably passes closer to the top than to the bottom, as the value at the top is closer to zero than the value at the bottom. It might make sense to simply interpolate linearly between the two values. Specifically, if $f$ attains the value $z$ at some point between $p_1$ and $p_2$ where $f(p_1)=z_1$ and $f(p_2)=z_2$, then a linear interpolation assumes the crossing point is $$p_1 + \left(p_2-p_1\right)\frac{z-z_1}{z_2-z_1}.$$ It's pretty easy to see that the interpolated crossing point is $p_1$ when $z=z_1$ and $p_2$ when $z=z_2$, so this seems reasonable.

Of course - what goes in, must come out. Thus, we see another crossing point on the opposite side and we connect the two crossing points with a line. If we do this with all the squares in the grid, we get

enter image description here

Not perfect but not bad either. It is a bit odd that there is a triangle that's appeared near the center. This arises in the unusual situation that the contour crosses three edges of a square.

Again, this is a pretty basic scheme but it's a good starting point. There are a number of modifications that readily suggest themselves, like recursive refinement locally or an alternative type of grid or a higher order interpolation scheme. Also, the image is composed of a large number of separate, short line segments. Since those segments share endpoints, however, it's easy to merge them into groups of larger paths.

Of course, the easiest thing to do to improve the quality is to just use more points. Here's the image using a $250\times250$ grid:

enter image description here