It is widely known in the academic world that \TeX\ is the {\it standard de facto} language for authoring academic documents. 


\LaTeX\ is a typesetting language that evolved from \TeX.


You can do things like {\bf this} and \emph{this}.


\begin{verbatim}
You can do things like {\bf this} and \emph{this}.
\end{verbatim}

Mathematics has great uses, even for the non-math major. Math develops analytical and critical thinking which benefit lifelong problem solving. These skills are of paramount importance in our society, regardless of field or profession---the ability to break any situation down into its elements, and determine how each variable is related. 


Thanks to \href{http://mathjax.org}{MathJAX}, we can render \LaTeX\ equations in the browser. Here is an example


\begin{verbatim}
$$\int_0^\infty H(\omega)e^{i\omega x} dx$$
\end{verbatim}

which produces

$$\int_0^\infty H(\omega)e^{i\omega x} dx$$

more info on \TeX support here (read carefully!) \href{http://docs.mathjax.org/en/latest/tex.html}{http://docs.mathjax.org/en/latest/tex.html}


LaTeX

Often scientists need to convey information in a non-textual way to express certain ideas that otherwise would be difficult to communicate. Using \TeX\ alone would be difficult, and out of that need packages like TikZ and PSTricks. 


For the Web, there are many solutions, but none that provide client-side rendering of diagrams for packages like PSTricks in an analogy to how MathJAX has done for \LaTeX. 


Because \LaTeX\ is so popular, PStricks became wide-spread and many academics use it to produce diagrams in academic text. Also, many programs generate PSTricks as well. Note that this platform could have supported TiKZ, but I chose PSTricks because of the difference in verbosity, and wanted to use a higher-level of abstraction. TiKZ support would be a great addition in the future!


Let's get to the point. The core of PSTricks is graphics!

\begin{center}
\begin{pspicture}(-5,-5)(5,5)
\psline{->}(0,-3.75)(0,3.75)
\psline{->}(-3.75,0)(3.75,0)
\pscircle(0,0){ 3 }	
\end{pspicture}
\end{center}

which can be produced using the following tex:

\begin{verbatim}
\begin{center}
\begin{pspicture}(-5,-5)(5,5)
\psline{->}(0,-3.75)(0,3.75)
\psline{->}(-3.75,0)(3.75,0)
\pscircle(0,0){ 3 }	
\end{pspicture}
\end{center}

\end{verbatim}


But more importantly, and probably the best part of using such a package is that you also get to mix beautiful mathematics with a consistent look for your diagrams. This can be done using \emph{rput}:

\begin{center}
\begin{pspicture}(0,-3)(8,3)

\rput(0,0){$x(t)$}
\rput(4,1.5){$f(t)$}
\rput(4,-1.5){$g(t)$}
\rput(8.2,0){$y(t)$}
\rput(1.5,-2){$h(t)$}

\psframe(1,-2.5)(7,2.5)
\psframe(3,1)(5,2)
\psframe(3,-1)(5,-2)

\rput(4,0){$X_k = \frac{1}{p} \sum \limits_{n=\langle p\rangle}x(n)e^{-ik\omega_0n}$}

\psline{->}(0.5,0)(1.5,0)
\psline{->}(1.5,1.5)(3,1.5)
\psline{->}(1.5,-1.5)(3,-1.5)

\psline{->}(6.5,1.5)(6.5,0.25)
\psline{->}(6.5,-1.5)(6.5,-0.25)
\psline{->}(6.75,0)(7.75,0)
\psline(1.5,-1.5)(1.5,1.5)
\psline(5,1.5)(6.5,1.5)
\psline(5,-1.5)(6.5,-1.5)
\psline(6,-1.5)(6.5,-1.5)

\pscircle(6.5,0){0.25}
\psline(6.25,0)(6.75,0)
\psline(6.5,0.5)(6.5,-0.5)

\end{pspicture}
\end{center}

which can be produced with the following \LaTeX\ (hint: try to copy and paste it into \href{/sandbox}{the sandbox}): 

\begin{verbatim}
\begin{center}
\begin{pspicture}(0,-3)(8,3)
\rput(0,0){$x(t)$}
\rput(4,1.5){$f(t)$}
\rput(4,-1.5){$g(t)$}
\rput(8.2,0){$y(t)$}
\rput(1.5,-2){$h(t)$}
\psframe(1,-2.5)(7,2.5)
\psframe(3,1)(5,2)
\psframe(3,-1)(5,-2)
\rput(4,0){$X_k = \frac{1}{p} \sum \limits_{n=\langle p\rangle}x(n)e^{-ik\omega_0n}$}
\psline{->}(0.5,0)(1.5,0)
\psline{->}(1.5,1.5)(3,1.5)
\psline{->}(1.5,-1.5)(3,-1.5)
\psline{->}(6.5,1.5)(6.5,0.25)
\psline{->}(6.5,-1.5)(6.5,-0.25)
\psline{->}(6.75,0)(7.75,0)
\psline(1.5,-1.5)(1.5,1.5)
\psline(5,1.5)(6.5,1.5)
\psline(5,-1.5)(6.5,-1.5)
\psline(6,-1.5)(6.5,-1.5)
\pscircle(6.5,0){0.25}
\psline(6.25,0)(6.75,0)
\psline(6.5,0.5)(6.5,-0.5)
\end{pspicture}
\end{center}
\end{verbatim}

You can specify {\tt linewidth, linecolor, fillstyle, fillcolor} on most PSTricks objects. For example:

\begin{center}
\begin{pspicture}(-2,-2)(2,2)
\psline[linecolor=green]{->}(0,0)(1.2,1.2)
\psline[linecolor=red]{->}(0,0)(-1.2,-1.2)
\psline[linecolor=purple]{->}(0,0)(1.2,-1.2)
\psline[linecolor=lightblue]{->}(0,0)(-1.2,1.2)
\end{pspicture}
\end{center}

Which can be created with the following source:

\begin{verbatim}
\begin{pspicture}(-2,-2)(2,2)
\psline[linecolor=green]{->}(0,0)(1.2,1.2)
\psline[linecolor=red]{->}(0,0)(-1.2,-1.2)
\psline[linecolor=purple]{->}(0,0)(1.2,-1.2)
\psline[linecolor=lightblue]{->}(0,0)(-1.2,1.2)
\end{pspicture}
\end{verbatim}

Fill modes can be useful to show things like integration and area:

\begin{interactive}
\begin{center}
\begin{pspicture}(-4,-3)(4,3)
\psplot[algebraic,linewidth=2pt,fillstyle=solid, fillcolor=lightblue]{-1.5}{1.5}{sin(x)}
\psplot[algebraic,linewidth=2pt]{-4}{4}{sin(x)}
\psline{->}(-4,0)(4,0)    
\end{pspicture}
\end{center}
\end{interactive}
\begin{print}
\begin{center}
\begin{pspicture}(-4,-3)(4,3)
\psplot[algebraic,linewidth=2pt,fillstyle=solid, fillcolor=lightblue]{-3.14}{3.14}{sin(x)}
\psplot[algebraic,linewidth=2pt]{-4}{4}{sin(x)}
\psline{->}(-4,0)(4,0)    
\end{pspicture}
\end{center}
\end{print}

Which can be created with the following source:

\begin{verbatim}
\begin{pspicture}(-4,-3)(4,3)
\psplot[algebraic,linewidth=2pt,fillstyle=solid, fillcolor=lightblue]{-1.5}{1.5}{sin(x)}
\psplot[algebraic,linewidth=2pt]{-4}{4}{sin(x)}
\psline{->}(-4,0)(4,0)    
\end{pspicture}
\end{verbatim}



\psset{unit=0.5}
\begin{center}
\begin{pspicture}(-13,-1.25)(13,3)

\psplot[algebraic,linewidth=1.5pt,plotpoints=1000]{-12.56}{12.56}{2*sin(x)/x}
\psaxes[showorigin=false,labels=none, Dx=3.14](0,0)(-12.6,0)(12.6,0)
\rput(5.7, 1){$a/b$}
\psline[linestyle=dashed](0,2)(5,2)
\psline{<->}(5,0)(5,2)
\rput(3.14, -0.5){$\frac{\pi}{a}$}
\rput(6.28, -0.5){$\frac{2\pi}{a}$}
\rput(9.42, -0.5){$\frac{3\pi}{a}$}
\rput(12.56, -0.5){$\frac{4\pi}{a}$}
\rput(-3.14, -0.5){$\frac{-\pi}{a}$}
\rput(-6.28, -0.5){$\frac{-2\pi}{a}$}
\rput(-9.42, -0.5){$\frac{-3\pi}{a}$}
\rput(-12.56, -0.5){$\frac{-4\pi}{a}$}
\rput(0, -0.5){$0$}

% begin x-axis labels:
\psline(-6.2831853, -0.1)(-6.2831853, 0.1)
\psline(-4.712388975, -0.1)(-4.712388975, 0.1)
\psline(-3.14159265, -0.1)(-3.14159265, 0.1)
\psline(-1.570796325, -0.1)(-1.570796325, 0.1)
\psline(0, -0.1)(0, 0.1)
\psline(1.570796325, -0.1)(1.570796325, 0.1)
\psline(3.14159265, -0.1)(3.14159265, 0.1)
\psline(4.712388975, -0.1)(4.712388975, 0.1)
\psline(6.2831853, -0.1)(6.2831853, 0.1)
% end x-axis labels:


\end{pspicture}
\end{center}


\begin{verbatim}
\begin{pspicture}(-13,-1.25)(13,3)
\psplot[algebraic,linewidth=1.5pt,plotpoints=1000]{-12.56}{12.56}{2*sin(x)/x}
\psaxes[showorigin=false,labels=none, Dx=3.14](0,0)(-12.6,0)(12.6,0)
\rput(5.7, 1){$a/b$}
\psline[linestyle=dashed](0,2)(5,2)
\psline{<->}(5,0)(5,2)
\rput(3.14, -0.5){$\frac{\pi}{a}$}
\rput(6.28, -0.5){$\frac{2\pi}{a}$}
\rput(9.42, -0.5){$\frac{3\pi}{a}$}
\rput(12.56, -0.5){$\frac{4\pi}{a}$}
\rput(-3.14, -0.5){$\frac{-\pi}{a}$}
\rput(-6.28, -0.5){$\frac{-2\pi}{a}$}
\rput(-9.42, -0.5){$\frac{-3\pi}{a}$}
\rput(-12.56, -0.5){$\frac{-4\pi}{a}$}
\rput(0, -0.5){$0$}
\psline(-6.2831853, -0.1)(-6.2831853, 0.1)
\psline(-4.712388975, -0.1)(-4.712388975, 0.1)
\psline(-3.14159265, -0.1)(-3.14159265, 0.1)
\psline(-1.570796325, -0.1)(-1.570796325, 0.1)
\psline(0, -0.1)(0, 0.1)
\psline(1.570796325, -0.1)(1.570796325, 0.1)
\psline(3.14159265, -0.1)(3.14159265, 0.1)
\psline(4.712388975, -0.1)(4.712388975, 0.1)
\psline(6.2831853, -0.1)(6.2831853, 0.1)
\end{pspicture}
\end{verbatim}



\begin{center}
\psset{xunit=1,yunit=2}
\begin{pspicture}(-8,-2)(8,2)
    

\psplot[algebraic,linewidth=2pt,fillstyle=solid, fillcolor=lightblue]{-3.14}{3.14}{sin(x)}
\psplot[algebraic,linewidth=2pt]{-6.2831}{6.2831}{sin(x)}

% function name
\rput(6.2831853,1.3){$\left|H(\omega)\right|$}

% x-axis
\psline(-6.6831853, 0)(6.6831853, 0)
\rput(6.6831853,-0.3){$\omega$}

% begin x-axis labels:
\psline(-6.2831853, -0.1)(-6.2831853, 0.1)
\rput(-6.2831853, -0.3){$-2\pi$}
\psline(-4.712388975, -0.1)(-4.712388975, 0.1)
\rput(-4.712388975, -0.3){$-\frac{3\pi}{2}$}
\psline(-3.14159265, -0.1)(-3.14159265, 0.1)
\rput(-3.14159265, -0.3){$-\pi$}
\psline(-1.570796325, -0.1)(-1.570796325, 0.1)
\rput(-1.570796325, -0.3){$-\frac{\pi}{2}$}
\psline(0, -0.1)(0, 0.1)
\rput(0, -0.3){$0$}
\psline(1.570796325, -0.1)(1.570796325, 0.1)
\rput(1.570796325, -0.3){$\frac{\pi}{2}$}
\psline(3.14159265, -0.1)(3.14159265, 0.1)
\rput(3.14159265, -0.3){$\pi$}
\psline(4.712388975, -0.1)(4.712388975, 0.1)
\rput(4.712388975, -0.3){$\frac{3\pi}{2}$}
\psline(6.2831853, -0.1)(6.2831853, 0.1)
\rput(6.2831853, -0.3){$2\pi$}
% end x-axis labels:
\end{pspicture}
\end{center}

\begin{verbatim}
\begin{pspicture}(-8,-2)(8,2)
\psplot[algebraic,linewidth=2pt,fillstyle=solid, fillcolor=lightblue]{-3.14}{3.14}{sin(x)}
\psplot[algebraic,linewidth=2pt]{-6.2831}{6.2831}{sin(x)}
\rput(6.2831853,1.3){$\left|H(\omega)\right|$}
\psline(-6.6831853, 0)(6.6831853, 0)
\rput(6.6831853,-0.3){$\omega$}
\psline(-6.2831853, -0.1)(-6.2831853, 0.1)
\rput(-6.2831853, -0.3){$-2\pi$}
\psline(-4.712388975, -0.1)(-4.712388975, 0.1)
\rput(-4.712388975, -0.3){$-\frac{3\pi}{2}$}
\psline(-3.14159265, -0.1)(-3.14159265, 0.1)
\rput(-3.14159265, -0.3){$-\pi$}
\psline(-1.570796325, -0.1)(-1.570796325, 0.1)
\rput(-1.570796325, -0.3){$-\frac{\pi}{2}$}
\psline(0, -0.1)(0, 0.1)
\rput(0, -0.3){$0$}
\psline(1.570796325, -0.1)(1.570796325, 0.1)
\rput(1.570796325, -0.3){$\frac{\pi}{2}$}
\psline(3.14159265, -0.1)(3.14159265, 0.1)
\rput(3.14159265, -0.3){$\pi$}
\psline(4.712388975, -0.1)(4.712388975, 0.1)
\rput(4.712388975, -0.3){$\frac{3\pi}{2}$}
\psline(6.2831853, -0.1)(6.2831853, 0.1)
\rput(6.2831853, -0.3){$2\pi$}
\end{pspicture}
\end{verbatim}

\psset{unit=1cm}
\begin{center}
\begin{pspicture}(-3.5,-3.25)(3.5,2)
\psplot[algebraic,linewidth=1.5pt]{-3.14}{3.14}{cos(x/2)}
\psaxes[showorigin=false,labels=none, Dx=3.14](0,0)(-3.25,0)(3.25,0)
\rput(3.14, -0.35){$\pi$}
\rput(-3.14, -0.35){$-\pi$}
\rput(0, -0.35){$0$}
\rput(1.25,1.25 ){$\left| H(\omega) \right| =\cos(\omega/2)$}
\end{pspicture}
\end{center}

\begin{verbatim}
\begin{pspicture}(-3.5,-3.25)(3.5,2)
\psplot[algebraic,linewidth=1.5pt]{-3.14}{3.14}{cos(x/2)}
\psaxes[showorigin=false,labels=none, Dx=3.14](0,0)(-3.25,0)(3.25,0)
\rput(3.14, -0.35){$\pi$}
\rput(-3.14, -0.35){$-\pi$}
\rput(0, -0.35){$0$}
\rput(1.25,1.25 ){$\left| H(\omega) \right| =\cos(\omega/2)$}
\end{pspicture}
\end{verbatim}

\begin{center}
\begin{pspicture}(-3.5,-1.25)(3.5,2)
\psplot[algebraic,linewidth=1.5pt]{-3.14}{3.14}{abs(sin(x/2))}
\psaxes[showorigin=false,labels=none, Dx=3.14](0,0)(-3.25,0)(3.25,0)
\rput(3.14, -0.35){$\pi$}
\rput(-3.14, -0.35){$-\pi$}
\rput(0, -0.35){$0$}
\rput(1,1.25 ){$\left| G(\omega) \right| =\left| \sin(\omega/2) \right|$}
\end{pspicture}
\end{center}

\begin{verbatim}
\begin{pspicture}(-3.5,-1.25)(3.5,2)
\psplot[algebraic,linewidth=1.5pt]{-3.14}{3.14}{abs(sin(x/2))}
\psaxes[showorigin=false,labels=none, Dx=3.14](0,0)(-3.25,0)(3.25,0)
\rput(3.14, -0.35){$\pi$}
\rput(-3.14, -0.35){$-\pi$}
\rput(0, -0.35){$0$}
\rput(1,1.25 ){$\left| G(\omega) \right| =\left| \sin(\omega/2) \right|$}
\end{pspicture}
\end{verbatim}


\begin{center}
\begin{pspicture}(0,-3.5)(8,2)


\rput(0,0){$x$}
\rput(7.2,0){$y$}
\rput(5.5,-1.25){$z^{-1}$}


\rput(3.65,-2){$\alpha$}
\rput(1.5,-2.5){$H$}

% plus or minus for adder
\rput(2.1,-0.5){$-$}
\rput(1.45,0.35){$+$}

\psframe(1,-3)(6.5,1)

\pspolygon(4,-1.5)(4,-2.5)(2.5,-2)

\psline{->}(0.25,0)(1.5,0)
\psline{->}(1.75,-2)(1.75,-0.25)
\psline{->}(5.5,-2)(4,-2)
\psline(2.5,-2)(1.75,-2)
\psline{->}(2,0)(7,0)
\psline(5.5,-1.7)(5.5,-2)
\psline{->}(5.5,0)(5.5,-0.75)

\psframe(5, -1.7)(6,-0.75)

\pscircle(1.75,0){0.25}
\psline(1.5,0)(2,0)
\psline(1.75,0.25)(1.75,-0.25)


\end{pspicture}
\end{center}

Which can be produced with the following \TeX:

\begin{verbatim}
\begin{pspicture}(0,-3.5)(8,2)
\rput(0,0){$x$}
\rput(7.2,0){$y$}
\rput(5.5,-1.25){$z^{-1}$}
\rput(3.65,-2){$\alpha$}
\rput(1.5,-2.5){$H$}
\rput(2.1,-0.5){$-$}
\rput(1.45,0.35){$+$}
\psframe(1,-3)(6.5,1)
\pspolygon(4,-1.5)(4,-2.5)(2.5,-2)
\psline{->}(0.25,0)(1.5,0)
\psline{->}(1.75,-2)(1.75,-0.25)
\psline{->}(5.5,-2)(4,-2)
\psline(2.5,-2)(1.75,-2)
\psline{->}(2,0)(7,0)
\psline(5.5,-1.7)(5.5,-2)
\psline{->}(5.5,0)(5.5,-0.75)
\psframe(5, -1.7)(6,-0.75)
\pscircle(1.75,0){0.25}
\psline(1.5,0)(2,0)
\psline(1.75,0.25)(1.75,-0.25)
\end{pspicture}
\end{verbatim}

PSTricks

Many of us think our thoughts using a language of some sort---there is usually some voice in our minds. Language in some ways, makes us who we are. Some even argue in the world of cognitive science that language is the foundation of our consciousness. 


An author who has in their minds representations of intelligent concepts should be able to freely express herself through language with free association---digital expressions of these ideas in some cases requires total control of the computer and all of its processes. 


The vision behind the personal computer was that any person could have full command of the functions of their device. I think this vision has come true to some degree, but not fully when it comes to creating graphics, especially mathematical diagrams online. 


Does the common mathematician or professor have the ability to express concepts through web technology? The Web has its own language, and the goal of this project is to help blur the lines between what authoring the mathematical Web should be like and typesetting beautiful Math.


If you know \LaTeX, then get ready to author interactive diagrams in real-time (try using mouse or touch to interact with diagrams).


\begin{interactive}


What matters most is minimizing the distance between our expression of an idea and the execution of that idea. For example, I can describe a vector at $(0,0)$ and initial value of the head at $(2,2)$ that will follow a user touch or mouse event. This will produce the following interaction:


\begin{center}
\begin{pspicture}(-2,-2)(2,2)
\psframe(-2,-2)(2,2)
\userline[linewidth=1.5 pt]{->}(0,0)(2,2)
\end{pspicture}
\end{center}


This was as easy as using this \TeX, which many math professors could understand.

\begin{verbatim}
\begin{pspicture}(-2,-2)(2,2)
\psframe(-2,-2)(2,2)
\userline[linewidth=1.5 pt]{->}(0,0)(2,2)
\end{pspicture}
\end{verbatim}


\begin{pspicture}(-2,-2)(2,2)
\psframe(-2,-2)(2,2)
\userline[linewidth=2pt,linecolor=green]{->}(0,0)(2,2){-x}{-y}
\userline[linewidth=2pt,linecolor=red]{->}(0,0)(2,2){0}{y}
\userline[linewidth=2pt,linecolor=purple]{->}(0,0)(2,2){-x}{cos(y)}
\userline[linewidth=2pt,linecolor=lightblue]{->}(0,0)(2,2)(sin(x)}{-y}
\end{pspicture}

\begin{verbatim}
\begin{pspicture}(-2,-2)(2,2)
\psframe(-2,-2)(2,2)
\userline[linewidth=2pt,linecolor=green]{->}(0,0)(2,2){-x}{-y}
\userline[linewidth=2pt,linecolor=red]{->}(0,0)(2,2){0}{y}
\userline[linewidth=2pt,linecolor=purple]{->}(0,0)(2,2){-x}{cos(y)}
\userline[linewidth=2pt,linecolor=lightblue]{->}(0,0)(2,2)(sin(x)}{-y}
\end{pspicture}
\end{verbatim}

I can also draw a more complex version, and start to make more useful diagrams to describe vectors:

\begin{center}
\begin{pspicture}(-5,-5)(5,5)
        
% y-axis
\rput(0.3,3.75){ $Im$ }
\psline{->}(0,-3.75)(0,3.75)

% x-axis
\rput(3.75,0.3){ $Re$ }
\psline{->}(-3.75,0)(3.75,0)
			
% the circle
\pscircle(0,0){ 3 }
			

 % new vector 
\rput(2.3,1){$e^{i\omega}-\alpha$}
\userline[linewidth=1.5 pt]{->}(1.500,0.000)(2.121,2.121)
\userline[linewidth=1.5 pt,linecolor=blue]{->}(0,0.000)(2.121,2.121){(x>0) ? 3 * cos( atan(-y/x) ) : -3 * cos( atan(-y/x) ) }{ (x>0) ? -3 * sin( atan(-y/x) ) : 3 * sin( atan(-y/x) )}

\userline[linewidth=1.5 pt,linestyle=dashed](-1.500,0.000)(2.121,2.121){x}{0}{x}{y}
\userline[linewidth=1.5 pt,linestyle=dashed](-1.500,0.000)(2.121,2.121){0}{y}{x}{y}

\rput(-0.75,-4.25){$1+\alpha$}
\rput(2.25,-4.25){$1-\alpha$}
\psline{<->}(-3,-4)(1.5,-4)
\psline{<->}(1.5,-4)(3,-4)
\psline[linestyle=dashed](3,-4.5)(3,0)
\psline[linestyle=dashed](-3,-4.5)(-3,0)
\psline[linestyle=dashed](1.5,-4.5)(1.5,0)

	
\end{pspicture}
\end{center}

\begin{verbatim}
\begin{pspicture}(-5,-5)(5,5)
\rput(0.3,3.75){ $Im$ }
\psline{->}(0,-3.75)(0,3.75)
\rput(3.75,0.3){ $Re$ }
\psline{->}(-3.75,0)(3.75,0)
\pscircle(0,0){ 3 }
\rput(2.3,1){$e^{i\omega}-\alpha$}
\userline[linewidth=1.5 pt]{->}(1.500,0.000)(2.121,2.121)
\userline[linewidth=1.5 pt,linecolor=blue]{->}(0,0.000)(2.121,2.121){(x>0) ? 3 * cos( atan(-y/x) ) : -3 * cos( atan(-y/x) ) }{ (x>0) ? -3 * sin( atan(-y/x) ) : 3 * sin( atan(-y/x) )}
\userline[linewidth=1.5 pt,linestyle=dashed](-1.500,0.000)(2.121,2.121){x}{0}{x}{y}
\userline[linewidth=1.5 pt,linestyle=dashed](-1.500,0.000)(2.121,2.121){0}{y}{x}{y}
\rput(-0.75,-4.25){$1+\alpha$}
\rput(2.25,-4.25){$1-\alpha$}
\psline{<->}(-3,-4)(1.5,-4)
\psline{<->}(1.5,-4)(3,-4)
\psline[linestyle=dashed](3,-4.5)(3,0)
\psline[linestyle=dashed](-3,-4.5)(-3,0)
\psline[linestyle=dashed](1.5,-4.5)(1.5,0)
\end{pspicture}
\end{verbatim}


Think about the student learning a new concept. Here is an example of teaching integration using ``area under the curve'', for example, you can represent $\int_a^b f(x) dx$ as:

\begin{center}
\begin{pspicture}(-4,-3)(4,3)
		
\uservariable{alpha}(0,0){x}

\psplot[algebraic,linewidth=2pt,fillstyle=solid, fillcolor=lightblue]{-4}{alpha}{sin(x)}
\psplot[algebraic,linewidth=2pt]{-4}{4}{sin(x)}
	
\psline{->}(-4,0)(4,0)

    
\end{pspicture}
\end{center}

\begin{verbatim}
\begin{pspicture}(-4,-3)(4,3)
\uservariable{alpha}(0,0){x}
\psplot[algebraic,linewidth=2pt,fillstyle=solid, fillcolor=lightblue]{-4}{alpha}{sin(x)}
\psplot[algebraic,linewidth=2pt]{-4}{4}{sin(x)}
\psline{->}(-4,0)(4,0)
\end{pspicture}
\end{verbatim}

The next example allows you to move the height of the graph and also integrate over a moving interval.

\begin{center}
\begin{pspicture}(-4,-3)(4,3)

\uservariable{alpha}(0,0){x}
\uservariable{beta}(0,0){y}

\psplot[algebraic,linewidth=2pt,fillstyle=solid, fillcolor=lightblue]{alpha-3}{alpha}{beta + sin(x)}
\psplot[algebraic,linewidth=2pt]{-4}{4}{beta + sin(x)}

\psline{->}(-4,0)(4,0)

\end{pspicture}
\end{center}


\begin{verbatim}
\begin{pspicture}(-4,-3)(4,3)
\uservariable{alpha}(0,0){x}
\uservariable{beta}(0,0){y}
\psplot[algebraic,linewidth=2pt,fillstyle=solid, fillcolor=lightblue]{alpha-3}{alpha}{beta + sin(x)}
\psplot[algebraic,linewidth=2pt]{-4}{4}{beta + sin(x)}
\psline{->}(-4,0)(4,0)
\end{pspicture}
\end{verbatim}

\end{interactive}



\begin{interactive}
\psset{unit=1cm}

\begin{center}
\begin{pspicture}(-3.5,-1)(3.75,3.5)

\slider{1}{8}{n}{$N$}{4}

\psplot[algebraic,linewidth=1.5pt,plotpoints=1000]{-3.14}{3.14}{cos(n*x/2)+1.3}
\psaxes[showorigin=false,labels=none, Dx=1.62](0,0)(-3.25,0)(3.25,2.5)

\psline[linestyle=dashed](-3.14,0.3)(3.14,0.3)
\psline[linestyle=dashed](-3.14,2.3)(3.14,2.3)
\rput(3.6,2.3){$\frac{1}{1-\alpha}$}
\rput(3.6,0.3){$\frac{1}{1+\alpha}$}


\rput(3.14, -0.35){$\pi$}
\rput(1.62, -0.35){$\pi/2$}
\rput(-1.62, -0.35){$-\pi/2$}
\rput(-3.14, -0.35){$-\pi$}
\rput(0, -0.35){$0$}

\end{pspicture}
\end{center}
\end{interactive}

\begin{verbatim}
\begin{pspicture}(-3.5,-1)(3.75,3.5)
\slider{1}{8}{n}{$N$}{4}
\psplot[algebraic,linewidth=1.5pt,plotpoints=1000]{-3.14}{3.14}{cos(n*x/2)+1.3}
\psaxes[showorigin=false,labels=none, Dx=1.62](0,0)(-3.25,0)(3.25,2.5)
\psline[linestyle=dashed](-3.14,0.3)(3.14,0.3)
\psline[linestyle=dashed](-3.14,2.3)(3.14,2.3)
\rput(3.6,2.3){$\frac{1}{1-\alpha}$}
\rput(3.6,0.3){$\frac{1}{1+\alpha}$}
\rput(3.14, -0.35){$\pi$}
\rput(1.62, -0.35){$\pi/2$}
\rput(-1.62, -0.35){$-\pi/2$}
\rput(-3.14, -0.35){$-\pi$}
\rput(0, -0.35){$0$}
\end{pspicture}
\end{verbatim}



\begin{interactive}
\psset{unit=0.5cm}
\begin{center}
\begin{pspicture}(-13,-5)(13,10)

\slider{1}{8}{a}{amplitude}{4}
\slider{1}{8}{n}{frequency}{4}

\psplot[algebraic,linewidth=1.5pt,plotpoints=1000]{-12.56}{12.56}{a*sin(n*x)/(n*x)}
\psaxes[showorigin=false,labels=none, Dx=3.14](0,0)(-12.6,0)(12.6,0)

\rput(0, -0.5){$0$}

\end{pspicture}
\end{center}
\end{interactive}


\begin{verbatim}
\begin{pspicture}(-13,-5)(13,10)
\slider{1}{8}{a}{amplitude}{4}
\slider{1}{8}{n}{frequency}{4}
\psplot[algebraic,linewidth=1.5pt,plotpoints=1000]{-12.56}{12.56}{a*sin(n*x)/(n*x)}
\psaxes[showorigin=false,labels=none, Dx=3.14](0,0)(-12.6,0)(12.6,0)
\rput(0, -0.5){$0$}
\end{pspicture}
\end{verbatim}



\begin{center}
\begin{pspicture}(-4,-3)(4,6)
\uservariable{alpha}(0.1,0){x}
\psplot[algebraic,linewidth=2pt]{-4}{4}{pow(x,2)}
\psplot[algebraic,linecolor=blue,linewidth=3]{-4}{4}{4*(x-alpha)*alpha}
\psline{->}(-4,0)(4,0)
\end{pspicture}
\end{center}

\begin{verbatim}
\begin{pspicture}(-4,-3)(4,6)
\uservariable{alpha}(0.1,0){x}
\psplot[algebraic,linewidth=2pt]{-4}{4}{pow(x,2)}
\psplot[algebraic,linecolor=blue,linewidth=3]{-4}{4}{4*(x-alpha)*alpha}
\psline{->}(-4,0)(4,0)
\end{pspicture}
\end{verbatim}

1 Expressing Ideas Through Technology