Authoring Applications: Building an Application with Explore
Overview
This example outlines two important aspects of application authoring: how embedded components are used to make documents "interactive" and how the Explore command can be used to build the embedded components required for an interactive application.
The primary example that will be built in this example worksheet is similar to the following:
Explore(plot3d(r, theta = 0 .. tt, h = 0 .. hh, coords = cylindrical, view = [-10 .. 10, -10 .. 10, 0 .. 10]), parameters = [r = 7.5 .. 10, tt = 0.1e-1 .. 6.28, hh = 0.1e-1 .. 10], initialvalues = [r = 7.5, tt = 3, hh = 3.14], placement = right)
r
tt
hh
In the above, the Explore command generates an interactive application containing embedded component s that are used to examine three parameters for a given Maple command or mathematical expression. More specifically, there are three embedded slider components that control values for the parameters radius, height, and angle for a 3-D plot surface. The results of modifying any of the parameters in this plot expression is shown in a corresponding plot component.
1. What are "Interactive" Documents?
Section Summary
This section outlines interactive documents including the use of embedded components to drive interactivity in documents.
Many types of Maple documents including applications, examples, or Math Apps use embedded components to drive interaction inside the document. Embedded Components, such as dials, gauges, sliders, or plots, are simple graphical interface components that you embed into a worksheet or document. A full list of available components can be seen on the embedded components help page or in the Components palette in the palette dock.
Figure 1.1: Component Palette
Any Maple document can have added embedded components that control aspects of the computations or visualizations in the document. In general, any Maple document with these controllers can be referred to as an interactive document, where the embedded elements allow for interaction with contained expressions, plots, and other Maple constructs. Math Apps are a special class of interactive application, which are mostly aimed at education, and provide an interface for conceptual exploration of key topics. Math Apps are built using embedded components and the Maple Programming Language. You can browse the inventory of Math Apps in the Math App Guide.
The following example contains several embedded components, including a dial which controls the "Phase Shift", a slider that controls the "Amplitude", two math containers that show the function and its derivative, and, finally, a plot component that displays the plot of the function and its derivative. To interact with the components, simply turn the dial or slide the slider with your mouse. Notice that the slider and dial control input for the parameters of the listed function. The math containers and plot component show output based on the input parameters for the chosen expression.
Example: Embedded Components
Phase shift
Amplitude
Function
Derivative
The distinction between input and output for embedded components is important. Many components can be used for both input and output, however many components, such as dials, gauges, and buttons, are more typically input controllers, while plots and text areas are more often used for displaying output from adjusted input controllers. The notion of using embedded components for input as well as output naturally leads to the use of the programmatic GetProperty and SetProperty commands, which are used to "get" input parameters and "set" output parameters for embedded components. Another example worksheet, Building an Interactive Number Line discusses this topic in greater detail.
2. An Introduction to the Explore command
The Explore command and pop-up dialog box assistant are used to create interactive content that explores parameterized mathematical expressions, plots, or images. This section introduces Explore and shows several examples of simple interactive applications built using Explore.
The Explore command takes an arbitrary Maple expression or function call and displays an interactive application to explore its evaluation at varying values of its dependent parameters. The interactive application for the exploration is comprised of various embedded components within a Standard GUI Table. Table 2.1 shows a simple exploration of a cylindrical coordinate system where three sliders control input for three parameters, namely, the radius, height, and angle, for a 3-D surface. The sliders allow you to vary each of these parameters, and the updated results are displayed in the embedded Plot container.
Table 2.1: Exploration of a cylindrical coordinate system
Slider components allow for the values of the parameters to be changed. The result of evaluating the expression or function call at the values specified by the controllers is displayed either as an expression in a MathContainer, a plot in a PlotComponent, or as an image on a Label. A plotting command to be explored can be a function call to plot, plot3d, a command in the plots package, or any user-defined procedure which returns a two- or three-dimensional plot structure or an Array of such plot structures.
There are two ways you can use the Explore command: either by selecting Explore from the Context Panel for an expression, or by calling the Explore command. The following is a screen shot of the Explore dialog box, accessed through the Context Panel, used in the following example.
Figure 2.2: Explore Assistant
Example: Use the exploration assistant to examine the behavior of the Taylor series for ⅇx as the expansion order n is varied.
In this example, the Explore dialog box is used to create a collection of embedded components, including a math container and a slider, that allow for visualization of the results of varying the parameter n.
To interact with this example:
Click on the following expression and select Explore from the Context Panel.
Select the box beside x to skip exploration for the value 'x'. In this example, we want to vary the value of n only.
Press Explore at the bottom of the dialog box in order to insert the interactive components.
taylorⅇx,x,n
n
Notice that as you slide the value for n, the results in the math container output area above the slider are updated automatically.
Example: Use the exploration assistant to examine changes to the graph of sinr y s x2 as r and s are varied.
In this example, the Explore dialog box can be used to create a collection of embedded components, including a plot component and a slider, that allow for the visualization of the results of varying the parameters r and s.
In this example, we want to explore two parameters, r and s. Change the second value for r from 10 to 6.28 and change the first value of s to 1.
It is useful to familiarize yourself with the other options in the dialog. These correspond to options for the Explore command. Try to change the controller for the r parameter to be a dial.
plot3dsinr⋅y⋅s⋅x2,x=−1..1,y=−π..π,view=−2..2
s
Notice that both of the controllers affect the resulting plot contained in the output plot component.
Explore is a very useful tool for building interactive applications in your Maple document. In the next sections, we will use the Explore command to build similar interactive applications to those found in the Math Apps guide.
3. Examples Math Apps using Explore
Several Math Apps have been created using the Explore command. In this section, we will review a couple of Math Apps that were created with Explore.
The Math App guide features over 400 different interactive applications that explore many different areas of mathematics and science. Math Apps are interactive documents that merge math, text, images, and interactive components to provide conceptual background and interactive visualization of various topics. Several of these Math Apps were built using Explore to create the interactive components that visualize the discussed topic. For example, the following three explorations of coordinate systems were all built using Explore. Click on any of the icons to open the corresponding Math App.
Cylindrical Coordinates
Spherical Coordinates
Toroidal Coordinates
(Optional): To get a better idea of how Explore code was integrated into these Math Apps, click on the Startup Code icon inside of any of these applications:
The startup code contains commands which indicate that the code was copied directly from an application created with Explore. In the following section, we will walk through building a similar Math App to these examples for another coordinate system using the simple Explore command syntax.
4. Building an Interactive Application with the Explore Assistant
This section gives an example on how the Explore command can build an interactive application to build a visualization for the toroidal coordinate system.
When using the Explore command or the Explore dialog box assistant, it is important to know the Maple command for generating the expression or plot. In the examples in the previous section, the explored expression is a 3-D plot for a given coordinate system. To see a list of the supported coordinate systems, see the coords help page. Each of these is created using a parameterized plot3d command, the code for which is actually shown in the title of the plot component. Using this code, we can, for example, create a toroidal surface using the following command:
plot3d1,height=−π..π,angle=−π..π,coords=toroidal
It can be observed that this generated surface is controlled by three parameters, namely radius, height, and angle. In the preceding command, the radius is equal to the first argument, 1. The height of the surface is controlled by the second parameter, height, which ranges from -π to π. The third argument corresponds to the angle, which ranges from -π to π. As an experiment, try to modify the values for the height and angle.
plot3d1,height=−π..π2,angle=−π..π2,coords=toroidal
Notice that as the ranges are changed, the displayed surface is modified to provide a different view of the surface.
The first step in building an interactive exploration for any expression is to identify the parameters to vary. In this case, there are three possible parameters which can be varied: radius, height, and angle. To create a parameterized version of the earlier command, we can simply substitute in placeholder variables into the expression.
As we saw in the second section, the Explore command can be run using the Context Panel. If an expression has one or more parameters, the Explore dialog box makes it possible to create an application wherein input controllers, such as sliders and gauges, control the parameter values for a chosen range.
Taking the earlier expression and substituting in r for the value 1, we can use the Explore dialog box to build an application that allows for varying the radius. To do so:
Select the box beside toroidal to not explore it as a parameter. In this exploration, we want to vary only the values for the radius, r.
Update the interval for the radius to be 1 at the lower value and 5 for the upper value.
plot3dr,height=−π..π,angle=−π..π,coords=toroidal
This generates a similar collection of components to those that we saw in the second section, namely an input slider and a plot component, which shows the output from the updated parameter value. The other Math Apps that we saw previously also allowed for control over the two other parameters, height and angle. In order to add more sliders for custom control over the parameter ranges for these two parameters, we can modify the expression by adding in two new values, h and θ, for the end points of the intervals for each of the parameters.
Once again, we can use the Explore dialog box to build the application as follows:
Select the box beside toroidal to not explore it as a parameter. In this exploration, we want to vary values for the radius, r, height, h, and angle, θ.
Update the interval for the radius, r, to be 1 at the lower value and 5 for the upper value.
Update the interval for the height, h, to be 0 at the lower value and 3.14 for the upper value.
Update the interval for the angle, θ, to be 0 at the lower value and 3.14 for the upper value.
At the bottom of the screen, in the box labeled Defaults, choose Right for placement. This will position all of the controlling components on the right side.
plot3dr,height=−π..h,angle=−π..θ,coords=toroidal
h
θ
Note that this application is very similar to the Toroidal Coordinates Math App.
5. Programmatic Application Authoring
At the end of the previous section, we built an interactive application with three sliders which varied parameter values for a plot3d expression. This section expands on Math App authoring using programmatic techniques.
In the last example, the Explore dialog box was used to create an interactive application containing three sliders that corresponded to three parameters and one plot component that displayed the resulting 3-D plot. The Explore dialog box can also be used as a way to generate code, which can be used to programmatically generate a similar application.
As before, we can use the Explore dialog box to build the application as follows:
At the bottom of the screen, in the box labeled Defaults, choose right for placement. This will position all of the controlling components on the right side.
Select the return command box at the bottom. This will return the interactive components as well as the programmatic syntax used to create the exploration.
plot3dr,height=−π..h,angle=−π..θ,coords=toroidal
Exploreplot3dr,height=−π..h,angle=−π..θ,coords=toroidal,parameters=h=0..3.14,controller=slider,r=1..5,controller=slider,θ=0..3.14,controller=slider,placement=right,loop=never,size=NoUserValue,numeric=false,echoexpression=true
Above the embedded components, the blue output is the Explore command that was used to create this application. If we copy this and execute it below, we notice that we get the same returned collection of components as before, but we don't need to spend extra time updating the parameter ranges again. This can save a lot of time when we are trying out different combinations of parameters and component settings!
Exploreplot3dr,height=−Pi..h,angle=−Pi..θ,coords=toroidal,parameters=h=0..3.14,controller=slider,r=1..5,controller=slider,θ=0..3.14,controller=slider,placement=right,loop=never,size=NoUserValue,numeric=false,echoexpression=true
The Explore command has many options which control different aspects of the resulting exploration. From the code above, we can see the updated values for the two options that we changed values for in steps 2 - 6 above:
parameters: A list specifying the parameters which can be varied. Each entry of this list corresponds to one parameter. This can also be modified to change the controller type used for each parameter.
placement: Sets a new default for placement of parameter controllers, with respect to the central embedded component that displays the explored plot, expression, or image.
We can add in other options, such as a title or overview description, by modifying the Explore command. We can also change the controller type used for each of the controllers. Also note that changing the order of the parameters controls the order of their display; here the slider for the parameter r is moved to the bottom.
Exploreplot3dr,height=−π..h,angle=−π..θ,coords=toroidal, view=−3.. 3,−3.. 3,−1 .. 1,scaling=constrained,parameters=h=−π.. π,controller=dial,θ=−π.. π,controller=dial,r=0.9.. 2.0,controller=slider,initialvalues=h=π, θ=0, placement=left,title=Toroidal Coordinates
The output from the Explore command can be copied into a new document and saved as a standalone application or shared on the MapleCloud. For more examples, see the ?examples,Explore help page.
Commands used in this example:
Explore
plot3d
6. (Optional) Advanced Authoring Example
This section describes creating an application using the Explore command on a function call to a user-defined module.
The following example is based on the Hopalong Attractor application, available for download in the Application Center.
The Hopalong plot constructor, as defined in the Code Edit Region below as an appliable module, accepts various values for parameters and options and returns a 2-D plot of the sections of the orbit(s) of the attractor.
The creation technique is as follows:
Define some procedure or appliable module which returns a 2-D or 3-D plot.
Explore a call to that procedure.
Ensure that the defined code is either in the document's Startup Code region or in a Code Edit region which has been toggled as autoexecute.
Delete the code that calls Explore, but don't yet re-execute its input line.
Either copy the inserted exploration assembly of components to the desired location in the document while removing the original, or simply leave the original (which would vanish if removed as output by re-execution of the block, say).
Here is the appliable module which returns the plot of the orbit(s). It's included here simply so that we can see it directly. This code has already been copied to the Startup Code region of this document, which is run upon restart or re-opening of this document.
Now let's call the plot constructor twice, and see what its outputs may look like:
Hopalong3.1, 1.1, 2.5, 5000, 1.0,1.0,1.0,−1.0,6.3,2.3
Hopalong3.0, 1.0, 2.6, 10000, 1.0,1.0,1.0,−1.0,6.3,2.3,background=black, symbolsize=5
Now let's build the exploration assembly of components that we'll use for the Application.
ExploreHopalonga,b,c,n,x1,y1,x2,y2,x3,y3, background=col,symbolsize=ss, parameters=seqt=−6.0..6.0,placement=left,t=a,b,c, n=10..10000, placement=left, ss=5,8,10,label=symbolsize,orientation=vertical, col=gray,white,black,label=background,orientation=vertical, seqcatx,i=−7.0..7.0, caty,i=−7.0..7.0,i=1..3, initialvalues=a=−2.05, b=.955, c=−2.45, n=1000, ss=5, x1=−5.5, y1=−5.5, x2=2.5, y2=−3.5, x3=2.2, y3=6.4, markers=x1,y1,x2,y2,x3,y3,color=green,symbol=solidcircle, symbolsize=20, showmarkercontrols=false, placement=bottom, title=Hopalong Attractor :
a
b
c
5810
graywhiteblack
Since the definition of `Hopalong` is executed automatically upon reopening this document, the exploration can be immediately explored in both Maple and the Maple Player.
plots:-pointplot
plots:-display
There are more examples that discuss application authoring in Maple, including:
Examples for the Explore command
?examples,Explore
Application Authoring: Building an Interactive Number Line
?examples,EmbeddedComponents,NumberLine
Building Dynamic Applications
?MaplePortal,Tutorial9
Download Help Document
