371 |
and discuss |
and discuss |
372 |
a simple algorithm for a shape with the desired properties. |
a simple algorithm for a shape with the desired properties. |
373 |
|
|
374 |
|
\newcommand{\p}{\mathbf{p}} |
375 |
|
\newcommand{\q}{\mathbf{q}} |
376 |
Suppose $A \subset \mathbf{R}^2$ is the part of the canvas we want to tear off, |
Suppose $A \subset \mathbf{R}^2$ is the part of the canvas we want to tear off, |
377 |
for example, a rectangle or an ellipse. |
for example, a rectangle or an ellipse. |
378 |
We want to define the corresponding irregular piece $B \subset \mathbf{R}^2$ |
We want to define the corresponding irregular piece $B \subset \mathbf{R}^2$ |
379 |
so as to make the movement of $A$ look natural. |
so as to make the movement of $A$ look natural. |
380 |
|
|
381 |
There should be some maximum radius $r$ of distortion such that |
There should be some maximum radius $r$ of distortion such that |
382 |
whether a point $y$ is in $B$ depends only on the set $A \cap B(q, r)$, |
whether a point $y$ is in $B$ depends only on the set $A \cap B(\q, r)$, |
383 |
where $B(q, r)$ is a ball of radius $r$ centered at $q \in \mathbf{R}^2$. |
where $B(\q, r)$ is a ball of radius $r$ centered at $\q \in \mathbf{R}^2$. |
384 |
$A \cap B(q, r) = \emptyset$ should imply $q \notin B$ and |
$A \cap B(\q, r) = \emptyset$ should imply $\q \notin B$ and |
385 |
$A \cap B(q, r) = B(y,r)$ should imply $q \in B$. |
$A \cap B(\q, r) = B(y,r)$ should imply $\q \in B$. |
386 |
Additionally, the mapping from $A$'s to $B$'s should be continuous |
Additionally, the mapping from $A$'s to $B$'s should be continuous |
387 |
so that slow movement of $A$ results into smooth ``rippling'' in $B$. |
so that slow movement of $A$ results into smooth ``rippling'' in $B$. |
388 |
Furthermore, the rippling should not be too fast. |
Furthermore, the rippling should not be too fast. |
401 |
$R \subset (\mathbf{R}^2)^2$ that identifies the points of $A$ |
$R \subset (\mathbf{R}^2)^2$ that identifies the points of $A$ |
402 |
with points in $B$: |
with points in $B$: |
403 |
\[ |
\[ |
404 |
B = \{\, q \mid \exists p \in A: p R q \,\}. |
B = \{\, \q \mid \exists \p \in A: \p R \q \,\}. |
405 |
\] |
\] |
406 |
If $\Vert p - q\Vert \le r$ for all $p R q$, the maximum distortion requirement |
If $\Vert \p - \q\Vert \le r$ for all $\p R \q$, |
407 |
is satisfied. |
the maximum distortion requirement is satisfied. |
408 |
|
|
409 |
If $R$ is a continuous function, i.e., $p R q \Leftrightarrow p = G(q)$, |
If $R$ is a continuous function, i.e., $\p R \q \Leftrightarrow \p = G(\q)$, |
410 |
the irregular shapes will be connected (if the original shape is connected), |
the irregular shapes will be connected (if the original shape is connected), |
411 |
but some parts of original |
but some parts of original |
412 |
shape may map to overlapping parts in the irregular shape. |
shape may map to overlapping parts in the irregular shape. |
414 |
image of its border. |
image of its border. |
415 |
|
|
416 |
If $R$ is a continuous function in the inverse direction, i.e., |
If $R$ is a continuous function in the inverse direction, i.e., |
417 |
$p R q \Leftrightarrow F(q) = p$, |
$\p R \q \Leftrightarrow F(\q) = \p$, |
418 |
there will be no overlapping. |
there will be no overlapping. |
419 |
Specifically, the edge of $A$ will map to the edge of $B$. |
Specifically, the edge of $A$ will map to the edge of $B$. |
420 |
However, the irregular shape may be scattered, if many points |
However, the irregular shape may be scattered, if many points |
426 |
texture shading hardware: |
texture shading hardware: |
427 |
the image of the undistorted shape can be stored in a texture and accessed |
the image of the undistorted shape can be stored in a texture and accessed |
428 |
with texture coordinates read from (or offset by) another texture storing the |
with texture coordinates read from (or offset by) another texture storing the |
429 |
inverse function (or the offset $F(q) - q$). |
inverse function (or the offset $F(\q) - \q$). |
430 |
This is called a dependent (or offset) texture access. |
This is called a dependent (or offset) texture access. |
431 |
|
|
432 |
The forward function cannot be efficiently implemented on fragment level, |
The forward function cannot be efficiently implemented on pixel level, |
433 |
because each fragment may depend on multiple values of the function. |
because each pixel may depend on multiple values of the function. |
434 |
The edge of the shape could be displaced on vertex level, |
The edge of the shape could be displaced on vertex level, |
435 |
but that is likely to not yield good performance if the shape has fine detail. |
but that is likely to not yield good performance if the shape has fine detail. |
436 |
Furthermore, intersections in the edge may cause additional problems. |
Furthermore, intersections in the edge may cause additional problems. |
507 |
|
|
508 |
The edge curve $C(x)$ of a conneccted shape can be obtained by simply |
The edge curve $C(x)$ of a conneccted shape can be obtained by simply |
509 |
displacing the edge in the normal direction of the envelope by a function |
displacing the edge in the normal direction of the envelope by a function |
510 |
$0\le f({\bf p})\le 1$ which only depends on the location ${\bf p}$ of the spine: |
$0\le f(\p)\le 1$ which only depends on the location $\p$ of the spine: |
511 |
$C(x) = E(x, f(E(x,1/2)))$. |
$C(x) = E(x, f(E(x,1/2)))$. |
512 |
|
|
513 |
The scattered case, on the other hand, can be obtained through a decision process: |
The scattered case, on the other hand, can be obtained through a decision process: |
514 |
again using a function $f({\bf p})$ of location ${\bf p}$, |
again using a function $f(\p)$ of location $\p$, |
515 |
a given point $E(x,y)$ is {\em inside} the tear-out, |
a given point $E(x,y)$ is {\em inside} the tear-out, |
516 |
iff $f(E(x,y)) > y$. |
iff $f(E(x,y)) > y$. |
517 |
|
|
521 |
|
|
522 |
These two algorithms correspond to one-dimensional displacement |
These two algorithms correspond to one-dimensional displacement |
523 |
and offset distortions, where the one dimension is in the normal direction. |
and offset distortions, where the one dimension is in the normal direction. |
524 |
That corresponding function and inverse function are |
The corresponding function and inverse function are |
525 |
\begin{eqnarray} |
\begin{eqnarray} |
526 |
G_n(p) &=& p + r n (2f(p) - 1), \\ |
G_n(\p) &=& \p + (r N) (2f(\p) - 1), \\ |
527 |
F_n(q) &=& q - r n (2f(q) - 1), |
F_n(\q) &=& \q - (r N) (2f(\q) - 1), |
528 |
\end{eqnarray} |
\end{eqnarray} |
529 |
where $n$ is the unit normal and $r$ the distortion radius. |
where $N$ is the unit normal and $r$ is the distortion radius. |
530 |
|
|
531 |
Although these algorithms seem different and produce different results, there is |
Although these algorithms seem different and produce different results, |
532 |
actually a general formulation which yields to a visual explanation. |
there is actually a general formulation in the one-dimensional case. |
533 |
Both algorithms can be seen as computing the intersection of a |
Both algorithms can be seen as computing the intersection of a |
534 |
\emph{ripple volume}, the volume below the surface $({\bf p}, f({\bf p}))$, |
\emph{ripple volume}, the volume below the surface $(\p, f(\p))$, |
535 |
and a \emph{cutting surface} $(E(x,g(y)), y)$, |
and a \emph{cutting surface} $(E(x,g(y)), y)$, |
536 |
and then mapping the intersection on the envelope $E(x,y)$ |
and then mapping the intersection on the envelope $E(x,y)$ |
537 |
using the parameters of the cutting surface. |
using the parameters of the cutting surface. |
598 |
with texture coordinates interpolated as $(x,g(y))$ |
with texture coordinates interpolated as $(x,g(y))$ |
599 |
and the alpha component of the primary color as $(1-y)$. |
and the alpha component of the primary color as $(1-y)$. |
600 |
The left side of the inequality can be computed using |
The left side of the inequality can be computed using |
601 |
texture environment mode ADD and an INTENSITY texture storing $f({\bf p})$. |
texture environment mode ADD and an INTENSITY texture storing $f(\p)$. |
602 |
The alpha output of the texture environment can then be tested |
The alpha output of the texture environment can then be tested |
603 |
against $1$ using ALPHA\_TEST to discard fragments outside |
against $1$ using ALPHA\_TEST to discard fragments outside |
604 |
the tear-out. |
the tear-out. |
847 |
The border of the intersection shape is obtained |
The border of the intersection shape is obtained |
848 |
as a similar intersection using the half-planes corresponding to |
as a similar intersection using the half-planes corresponding to |
849 |
the outer edges of the borders. |
the outer edges of the borders. |
850 |
|
The intersection can be implemented using stencil operations. |
851 |
|
|
852 |
The intersection can be implemented by drawing the outside |
%by drawing the outside |
853 |
to the stencil buffer for each side of the shape. |
%to the stencil buffer for each side of the shape. |
854 |
The inside is then drawn |
%The inside is then drawn |
855 |
with stencil test set to discard those fragments that were |
%with stencil test set to discard those fragments that were |
856 |
drawn to the stencil buffer as the outside of the shape. |
%drawn to the stencil buffer as the outside of the shape. |
857 |
This method works even if the tear-out shape has no corners, |
%This method works even if the tear-out shape has no corners, |
858 |
and requires no extra passes over the inside of the shape |
%and requires no extra passes over the inside of the shape |
859 |
(the stencil can be cleared as the contents are drawn). |
%(the stencil can be cleared as the contents are drawn). |
860 |
|
|
861 |
|
When the tear-out reaches the edge of canvas, the smooth |
862 |
|
canvas border should be drawn instead of the parts of the tear-out |
863 |
|
shape extending outside the canvas. |
864 |
|
This can be implemented with stencil operations: |
865 |
|
First the full tear-out shape including the border is drawn |
866 |
|
to the stencil buffer. |
867 |
|
Then the canvas with its borders is drawn on screen using stencil test, |
868 |
|
and another bit is written to the stencil buffer for each canvas pixel |
869 |
|
ending up on screen. |
870 |
|
That stencil bit is then used to draw borders for the torn edges. |
871 |
|
|
872 |
If a canvas is torn into multiple pieces, the above methods |
If a canvas is torn into multiple pieces, the above methods |
873 |
produce edges that do not fit together: the edges of adjacent |
produce edges that do not fit together: the edges of adjacent |
874 |
pieces have opposing ripples. |
pieces have opposing ripples. |
875 |
The problem is partly solved by inverting (i.e., $1-f({\bf p})$) |
The problem is partly solved by inverting (i.e., $1-f(\p)$) |
876 |
the ripple function for either one of each pair of facing sides. |
the ripple function for either one of each pair of facing sides. |
877 |
But then a 180 degree rotation of a pair of fitting pieces |
But then a 180 degree rotation of a pair of fitting pieces |
878 |
inverts the torn shape between them, breaking the principle of |
inverts the torn shape between them, breaking the principle of |
879 |
tying ripple shape to canvas location. |
tying ripple shape to canvas location. |
880 |
|
|
881 |
The problem can be fully solved with a vector valued ripple function |
The problem can be fully solved with a vector valued ripple function |
882 |
${\bf F}({\bf p})$, $\Vert{\bf F}({\bf p})\Vert \le 1$, |
$F({\p})$, $\Vert F({\p})\Vert \le 1$, |
883 |
using $f({\bf p}) = (1 + {\bf d}\cdot {\bf F}({\bf p}))/2$, |
using $f({\p}) = (1 + N \cdot F({\p}))/2$, |
884 |
where ${\bf d}$ is the unit normal |
where $N$ is the unit normal |
885 |
of the envelope. The dot product automatically inverts the |
of the envelope. The dot product automatically inverts the |
886 |
function for a 180 degree rotation. |
function for a 180 degree rotation. |
887 |
XXX: equivalent to drawing each envelope section by real 2D-offsetting |
XXX: equivalent to drawing each envelope section by real 2D-offsetting |