Agent Skills: Desmos Graphing in Obsidian

Create interactive Desmos graphs in Obsidian using desmos-graph code blocks. Use when visualizing functions, parametric curves, inequalities, or mathematical relationships with customizable styling and settings.

UncategorizedID: aiskillstore/marketplace/desmos-graphing

Install this agent skill to your local

pnpm dlx add-skill https://github.com/aiskillstore/marketplace/tree/HEAD/skills/bityoungjae/desmos-graphing

Skill Files

Browse the full folder contents for desmos-graphing.

Download Skill

Loading file tree…

skills/bityoungjae/desmos-graphing/SKILL.md

Skill Metadata

Name
desmos-graphing
Description
Create interactive Desmos graphs in Obsidian using desmos-graph code blocks. Use when visualizing functions, parametric curves, inequalities, or mathematical relationships with customizable styling and settings.

Desmos Graphing in Obsidian

⚠️ CRITICAL: Dual Parser System

The plugin uses different parsers for different parts:

| Location | Parser | pi | sqrt | Example | |----------|--------|-----|------|---------| | Settings | mathjs | pi | - | left=-2*pi+0.5 | | Equations | Desmos (LaTeX) | \pi | \sqrt{x} | y=\sqrt{x}+\pi | | Points | Desmos (LaTeX) | \pi | \sqrt{x} | (\pi/2, 1) | | Restrictions | plain math | numeric | x^0.5 | x>-1.5708 |

✅ CORRECT
left=-0.5; right=2*pi+0.5
---
y=\sqrt{x}|blue
y=x/\sqrt{3}|green|0<=x<=3^0.5
(\pi/2, 0)|label:cos(90°)=0

❌ WRONG (will error)
left=-2*\pi               # Error: "Syntax error in part '\pi'"
y=\sin(x+pi/4)            # Error: "Too many variables" (p*i)
(pi/2, 0)                 # Error: "Too many variables" ← Points need LaTeX!
y=x/sqrt(3)|0<=x<=sqrt(3) # Error: "Too many variables" (s*q*r*t)

Key rule: \sqrt{x} in equations, x^0.5 in restrictions!

Code Block Format

```desmos-graph
[settings]
---
[equations]
```
  • Settings (optional) above ---, equations below
  • Each equation on its own line
  • Use | to add styling/restrictions to equations

Quick Start

Basic Function

```desmos-graph
y=x^2
y=\sin(x)|blue
```

With Settings

```desmos-graph
left=-2*pi; right=2*pi
bottom=-2; top=2
---
y=\sin(x)|red
y=\cos(x)|blue|dashed
```

Points and Labels

```desmos-graph
(0, 0)|label:Origin
(3, 4)|red|label:Point A
(\pi/2, 1)|blue|label:π/2    # Use \pi in coordinates!
y=x|dashed
```

⚠️ Points use LaTeX: (\pi/2, 0) not (pi/2, 0)

Essential Settings

| Setting | Default | Description | |---------|---------|-------------| | width | 600 | Graph width in pixels | | height | 400 | Graph height in pixels | | left | -10 | Left boundary | | right | 10 | Right boundary | | bottom | -7 | Bottom boundary | | top | 7 | Top boundary | | grid | true | Show grid lines | | degreeMode | radians | radians or degrees |

Additional Settings

| Setting | Default | Description | |---------|---------|-------------| | hideAxisNumbers | false | Hide axis number labels | | xAxisLabel | - | Custom x-axis label | | yAxisLabel | - | Custom y-axis label | | xAxisLogarithmic | false | Logarithmic x-axis scale | | yAxisLogarithmic | false | Logarithmic y-axis scale | | defaultColor | - | Default color for all equations |

Settings use = for values, separated by ; or newlines. Bounds accept math expressions: left=-2*pi

Equation Styling

Use | (pipe) to add styling after an equation:

equation|color|style|restrictions|label

Segment order is flexible - the parser auto-detects each segment type.

⚠️ CRITICAL: | is RESERVED as delimiter!

The pipe character cannot appear in equations or labels:

(1, 0)|label:|v|=5         # ❌ Error: label parsed as empty
(1, 0)|label:∥v∥=5         # ✅ Use Unicode ∥ (U+2225)
y=|x|                      # ❌ Error: pipes split the equation
y=abs(x)                   # ✅ Use abs() function

Colors

Supported names: red, green, blue, yellow, orange, purple, cyan, magenta, black, white

Hex codes: #rrggbb or #rgb (e.g., #ff6600, #f60)

⚠️ gray/grey are NOT supported! Use hex instead:

  • Light gray: #c0c0c0
  • Medium gray: #808080
  • Dark gray: #404040
y=x|gray           # ❌ Error: parsed as restriction
y=x|#808080        # ✅ Correct

Line & Point Styles

| Line | Point | Effect | |------|-------|--------| | solid | point | Default (solid/filled) | | dashed | open | Dashed/open circle | | dotted | cross | Dotted/X mark |

Labels

(1, 2)|label shows "(1, 2)", (1, 2)|label:Point A shows custom text

Restrictions

Limit where equations are drawn:

y=x^2|0<x<5           # Only draw for 0 < x < 5
y=\sin(x)|x>0|y>0     # Multiple restrictions
y=2x|0<=x<=1          # <= and >= supported
y=\tan(x)|x>-1.5708|x<1.5708   # Use numeric values (π/2≈1.5708)

⚠️ CRITICAL: Use plain math, NOT LaTeX in restrictions!

| ✅ Correct | ❌ Wrong | Why | |-----------|---------|-----| | x/2<y | \frac{x}{2}<y | No LaTeX commands | | x^0.5<2 | \sqrt{x}<2 | Use ^0.5 not \sqrt | | 0<x<3^0.5 | 0<x<sqrt(3) | sqrt() → sqrt | | x>-1.5708 | x>-pi/2 | pi → pi, use numeric | | 0<x<1 | \{0<x<1\} | No braces needed |

The plugin auto-wraps restrictions with {} - don't add them yourself.

Hidden & Special Tags

f(x)=x^2|hidden       # Define but don't display
y=f(x)+1              # Use the hidden function
y=\sin(x)|noline      # Points only, no connecting line

Combining Styles

Order doesn't matter:

y=x^2|red|dashed|0<x<5
(1, 2)|open|blue|label:Start

Equation Types

| Type | Example | |------|---------| | Explicit | y=x^2 | | Implicit | x^2+y^2=25 | | Parametric | (\cos(t), \sin(t)) | | Polar | r=1+\cos(\theta) | | Piecewise | y=\{x<0: -x, x\} | | Point | (3, 4) | | Function def | f(x)=x^2 |

⚠️ Polar Equations Must Be Linear in r

Desmos only supports polar equations where r appears linearly:

r=1+\cos(\theta)       # ✅ Linear in r
r^2=\cos(2\theta)      # ❌ Error: "must be linear in r"

Solution: Convert to parametric curve:

# Lemniscate (r² = cos(2θ)) → parametric form
(\cos(t)\sqrt{\cos(2t)}, \sin(t)\sqrt{\cos(2t)})|blue

Parametric Curves Warning

⚠️ Expand parenthetical expressions to avoid parsing errors:

(2t, 4t(1-t))|blue     # ⚠️ May be misinterpreted as piecewise
(2t, 4t-4t^2)|blue     # ✅ Expanded form is safer

Piecewise Functions

⚠️ Escape curly braces with backslash:

y={x<0: -x, x}         # ❌ Error
y=\{x<0: -x, x\}       # ✅ Correct

Complete Examples

Trigonometric Phase Shifts

```desmos-graph
left=-2*pi; right=2*pi
bottom=-2; top=2
---
y=\sin(x)|blue
y=\sin(x+\pi/4)|red
y=\sin(x+\pi/2)|green
y=\sin(x+\pi)|purple|dashed
```

Bezier Curve with Control Points

```desmos-graph
left=-0.5; right=2.5
bottom=-0.5; top=2.5
---
(2t, 4t-4t^2)|blue
(0, 0)|black|label:P0
(1, 2)|black|label:P1
(2, 0)|black|label:P2
y=2x|#808080|dashed|0<x<1
y=-2x+4|#808080|dashed|1<x<2
```

Easing Functions

```desmos-graph
left=-0.2; right=1.2
bottom=-0.2; top=1.2
---
y=x|dashed|black
y=1-\cos(\pi*x/2)|blue|0<=x<=1
y=\sin(\pi*x/2)|red|0<=x<=1
```

Cosine with Special Points

```desmos-graph
left=-0.5; right=2*pi+0.5
bottom=-1.5; top=1.5
---
y=\cos(x)|blue
(0, 1)|red|label:cos(0)=1
(\pi/2, 0)|red|label:cos(π/2)=0
(\pi, -1)|red|label:cos(π)=-1
(3*\pi/2, 0)|red|label:cos(3π/2)=0
```

⚠️ Note: Settings use 2*pi, points use \pi, 3*\pi/2, etc.

Advanced

For complete documentation, see reference.md:

  • All 13 settings with defaults and auto-adjustment rules
  • Hex codes for unsupported colors (gray, pink, brown, etc.)
  • 13 error messages with causes and fixes
  • Detailed troubleshooting for common issues
  • Polar-to-parametric conversion examples