CL Newsletter, June 2020 - Connecting Graphs and Inputs

Our company's first product was a graphing calculator so it makes sense that teachers want to use Activity Builder to graph functions.

The easiest way to do that is to use a full-screen graph component but that has lots of downsides, especially that dashboards don't show you what you really want to know – the student's function. A math input results in a clearer dashboard but requires Computation Layer to connect the input to the graph

Teacher view in a dashboard of a full screen

Teacher view in a dashboard of a full screen graph.

This month, we'll share with you three common ways our team connects math inputs to a graph component.


Looking to bring an explicit function from a math input into a graph? Take any string and apply simpleFunction to it. Pair it with a function sink in a graph to create a function with that name in the calculator. Then, tell the calculator to graph the function by setting it to y.


Start with a string, in this case a student's input.

Tell Desmos to treat the string as a function.
3. 4.

Tell the calculator to graph your function

Try it out by copying and editing this screen!

Once you’ve created your function in CL, you can perform any operation on it that you would normally perform on a function defined in a graph. This allows you to drive animations, display critical points, or just have fun!

Check out some examples

Note: simpleFunction’s limiting factor is its inability to graph anything that is not a proper function. While it’s really smart about identifying functions written in different ways, as soon as one variable isn’t written explicitly as a function of another, simpleFunction will throw an error.

Yes ✅
No ❌
     y=3x+1 f(x)=3x+1 3x+1     
     -3x+y=1 y-1=3x x=3     


What do you do when you don’t have an explicit function? simpleFunction won’t plot things like circles or equations with operations on both sides. For that, there’s parseEquation. The primary function of parseEquation is to allow us to access the left and right hand sides of an equation. However, it also has a function that allows us to graph equations that aren’t explicit functions. The command is a bit lengthy and not the easiest to understand, but for those just looking to graph any equation it can be copied and reused from screen to screen by changing only the component and source (input.latex) to the current student input. We’ll include a brief description below, but to best understand how this function works, jump into the sample activity linked below.

function(“f”): parseEquation(input.latex).differenceFunction(“x”,”y”)

This command takes a string (input.latex) and creates a function by subtracting the left hand side from the right hand side. For example, for equation 3x+4y=10, the command above will create in the graph the function:

f(x,y) = (10) - (3x+4y)

Once this function is created in CL and sent into the graph, you can plot all of the places that the left and right hand side are equal by entering 0=f(x,y) in a blank line in the expression bar.

Check out this example

Note: parseEquation does come with some limitations. First, it requires an equation to operate, which means expressions or functions written in function notation won’t parse. Secondly, because we can’t guarantee a 1–1 relationship between the two variables, it's difficult and often impossible to compute outputs for a given input.


Unlike simpleFunction and parseEquation, xyLine does not create a function. Instead, as long as the equation of a line is entered, xyLine will give you access to everything you need to know about that line. Creating the function xyLine(input.latex,”x”,”y”) will open up a long menu of attributes. Assign the parts you need (like slope and y- intercept) to numbers, and use CL to send them into the graph. Then, write the equation in the graph using the numbers you created.

Check out this example

How Do They Stack Up?


  • CL command: function(“f”): simpleFunction(input.latex)
  • In the graph: y=f(x)
  • Graphs: Proper functions and expressions
  • Pros: Simple, makes identifying function values easy in the graph
  • Cons: Can only graph proper functions with operations on one side


  • CL command: parseEquation(input.latex).differenceFunction(“x”,”y”)
  • In the graph: 0 = f(x,y)
  • Graphs: Any equation
  • Pros: Graphs any equation, even ellipses and other non-functions in terms of x.
  • Cons: Difficult and often impossible to identify values for one variable based on the other


  • CL command: xyLine(input.latex,”x”,”y”)
  • In the graph: Create your own equation using numbers from xyLine
  • Graphs: Any line in any form
  • Pros: Includes everything you need to know about the line
  • Cons: Completely DIY. Important info needs to be extracted manually and the equation must be rebuilt in the graph.