4 Desmos | a simple & interactive graphing calculator

4.2 Desmos at a glance

Why use Desmos?

  • Interactive - students can play with parameters
  • Fast to create (+ easy animation)
  • Digitally Accessible
  • Free

Plotting in desmos

  • 2D Cartesian/polar coordinates
  • Domain/range restrictions/piecewise functions,
  • Shade area with inequalities, Differentiation, …
  • Paste tabular data from clipboard (1000 points) and fit

4.3 Making plots in Desmos

  1. Sign up for a free account on Desmos
  2. Create graph (see Graphing Calculator: Essential Skills)
  3. Copy embed code

Desmos Tips

  • Add points on graph for quick sliders in the embed

4.4 How to embed a Desmos graph

  1. Get the embed code from Desmos
  2. Paste in embed code to .Rmd file
  3. Change some embed code parameters
    • width="100%"
    • height="500px" (even 600px is probably ok even for iphone)
  4. Add a direct link (fallback for PDF and the edit on desmos button doesn’t display on mobile)

4.5 Adding a Desmos embed as a figure

Same as a “normal” bookdown figure but instead of knitr::include_graphics() use knitr::include_url(URL)

Example

Figure 4.1: View Travelling and standing wave plot. Upper: two identical but counter-propogating travelling waves will result in a standing wave below.

Bookdown Source

{r echo=FALSE, wavesanim , out.width=‘70%’, fig.show=‘hold’, fig.cap=“View Travelling and standing wave plot. Upper: two identical but counter-propogating travelling waves will result in a standing wave below.”} knitr::include_url(“https://www.desmos.com/calculator/qy6jc8mfi9?embed”)

Figure embed notes

  • Note: the figure referencing doesn’t work for in ioslides (you are unlikely to be cross-referencing anyway)
  • Reference as usual with \@ref(fig:label) (e.g. \@ref(fig:wavesanim) becomes Figure 4.1)
  • Captions make good places to links to graph

4.6 Desmos shortcomings

  • The embed only shows the plot, but not the left hand panel - you have to add sliders or student visit page to view the source
  • Not all Greek letters letters recognised! (Fix: Chrome/Edge addin for full Greek alphabet
  • No permalinks - Desmos updates URL after each save
  • Graphs are public - don’t put any personal/private data there
  • It’s possible but generally not recommended to embed the whole calculator (see 5.1)

What about my PDFs/offline support?

If there is no connection to the internet, the iframe will not load.

If you compile to a PDF, nothing is displayed, which is why a link is important! Possibly, one can do something clever in R to add use an image if knit to PDF…

4.7 Take away messages

person with laptop sitting on top of large browser window

  • It’s easy to embed web content with bookdown
  • Embeds don’t work for offline/PDF use
  • Desmos is free, interactive for students and easy to use: give it a try!