desmos-graphing
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.
下記のコマンドをコピーしてターミナル(Mac/Linux)または PowerShell(Windows)に貼り付けてください。 ダウンロード → 解凍 → 配置まで全自動。
mkdir -p ~/.claude/skills && cd ~/.claude/skills && curl -L -o desmos-graphing.zip https://jpskill.com/download/17541.zip && unzip -o desmos-graphing.zip && rm desmos-graphing.zip
$d = "$env:USERPROFILE\.claude\skills"; ni -Force -ItemType Directory $d | Out-Null; iwr https://jpskill.com/download/17541.zip -OutFile "$d\desmos-graphing.zip"; Expand-Archive "$d\desmos-graphing.zip" -DestinationPath $d -Force; ri "$d\desmos-graphing.zip"
完了後、Claude Code を再起動 → 普通に「動画プロンプト作って」のように話しかけるだけで自動発動します。
💾 手動でダウンロードしたい(コマンドが難しい人向け)
- 1. 下の青いボタンを押して
desmos-graphing.zipをダウンロード - 2. ZIPファイルをダブルクリックで解凍 →
desmos-graphingフォルダができる - 3. そのフォルダを
C:\Users\あなたの名前\.claude\skills\(Win)または~/.claude/skills/(Mac)へ移動 - 4. Claude Code を再起動
⚠️ ダウンロード・利用は自己責任でお願いします。当サイトは内容・動作・安全性について責任を負いません。
🎯 このSkillでできること
下記の説明文を読むと、このSkillがあなたに何をしてくれるかが分かります。Claudeにこの分野の依頼をすると、自動で発動します。
📦 インストール方法 (3ステップ)
- 1. 上の「ダウンロード」ボタンを押して .skill ファイルを取得
- 2. ファイル名の拡張子を .skill から .zip に変えて展開(macは自動展開可)
- 3. 展開してできたフォルダを、ホームフォルダの
.claude/skills/に置く- · macOS / Linux:
~/.claude/skills/ - · Windows:
%USERPROFILE%\.claude\skills\
- · macOS / Linux:
Claude Code を再起動すれば完了。「このSkillを使って…」と話しかけなくても、関連する依頼で自動的に呼び出されます。
詳しい使い方ガイドを見る →- 最終更新
- 2026-05-18
- 取得日時
- 2026-05-18
- 同梱ファイル
- 1
📖 Skill本文(日本語訳)
※ 原文(英語/中国語)を Gemini で日本語化したものです。Claude 自身は原文を読みます。誤訳がある場合は原文をご確認ください。
Obsidian における Desmos Graphing
⚠️ 重要: デュアルパーサーシステム
このプラグインは、異なる部分に対して異なるパーサーを使用します。
| 場所 | パーサー | pi | sqrt | 例 |
|---|---|---|---|---|
| 設定 | mathjs | pi |
- | left=-2*pi+0.5 |
| 方程式 | Desmos (LaTeX) | \pi |
\sqrt{x} |
y=\sqrt{x}+\pi |
| 点 | Desmos (LaTeX) | \pi |
\sqrt{x} |
(\pi/2, 1) |
| 制限 | プレーンな数式 | 数値 | x^0.5 |
x>-1.5708 |
✅ 正しい
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
❌ 間違い (エラーが発生します)
left=-2*\pi # エラー: "Syntax error in part '\pi'"
y=\sin(x+pi/4) # エラー: "Too many variables" (p*i)
(pi/2, 0) # エラー: "Too many variables" ← 点には LaTeX が必要です!
y=x/sqrt(3)|0<=x<=sqrt(3) # エラー: "Too many variables" (s*q*r*t)
重要なルール: 方程式では \sqrt{x}、制限では x^0.5 を使用します!
コードブロックの形式
```desmos-graph
[settings]
---
[equations]
```
- 設定 (オプション) は
---の上に、方程式は下に記述します。 - 各方程式は独自の行に記述します。
|を使用して、方程式にスタイル/制限を追加します。
クイックスタート
基本的な関数
```desmos-graph
y=x^2
y=\sin(x)|blue
```
設定あり
```desmos-graph
left=-2*pi; right=2*pi
bottom=-2; top=2
---
y=\sin(x)|red
y=\cos(x)|blue|dashed
```
点とラベル
```desmos-graph
(0, 0)|label:Origin
(3, 4)|red|label:Point A
(\pi/2, 1)|blue|label:π/2 # 座標には \pi を使用します!
y=x|dashed
```
⚠️ 点は LaTeX を使用します: (\pi/2, 0) であり、 (pi/2, 0) ではありません。
必須の設定
| 設定 | デフォルト | 説明 |
|---|---|---|
width |
600 | グラフの幅 (ピクセル単位) |
height |
400 | グラフの高さ (ピクセル単位) |
left |
-10 | 左側の境界 |
right |
10 | 右側の境界 |
bottom |
-7 | 下側の境界 |
top |
7 | 上側の境界 |
grid |
true | グリッド線を表示 |
degreeMode |
radians | radians または degrees |
追加の設定
| 設定 | デフォルト | 説明 |
|---|---|---|
hideAxisNumbers |
false | 軸の数値ラベルを非表示 |
xAxisLabel |
- | X軸のカスタムラベル |
yAxisLabel |
- | Y軸のカスタムラベル |
xAxisLogarithmic |
false | X軸の対数スケール |
yAxisLogarithmic |
false | Y軸の対数スケール |
defaultColor |
- | すべての方程式のデフォルトの色 |
設定では、値に = を使用し、; または改行で区切ります。
境界は数式を受け入れます: left=-2*pi
方程式のスタイリング
| (パイプ) を使用して、方程式の後にスタイルを追加します。
equation|color|style|restrictions|label
セグメントの順序は柔軟です。パーサーは各セグメントのタイプを自動的に検出します。
⚠️ 重要: | は区切り文字として予約されています!
パイプ文字は、方程式またはラベルに含めることはできません。
(1, 0)|label:|v|=5 # ❌ エラー: ラベルが空として解析されました
(1, 0)|label:∥v∥=5 # ✅ Unicode ∥ (U+2225) を使用します
y=|x| # ❌ エラー: パイプが方程式を分割します
y=abs(x) # ✅ abs() 関数を使用します
色
サポートされている名前: red, green, blue, yellow, orange, purple, cyan, magenta, black, white
16進コード: #rrggbb または #rgb (例: #ff6600, #f60)
⚠️ gray/grey はサポートされていません! 代わりに16進数を使用してください:
- 薄い灰色:
#c0c0c0 - 中程度の灰色:
#808080 - 濃い灰色:
#404040
y=x|gray # ❌ エラー: 制限として解析されました
y=x|#808080 # ✅ 正しい
線と点のスタイル
| 線 | 点 | 効果 |
|---|---|---|
solid |
point |
デフォルト (実線/塗りつぶし) |
dashed |
open |
破線/白丸 |
dotted |
cross |
点線/X印 |
ラベル
(1, 2)|label は "(1, 2)" を表示し、 (1, 2)|label:Point A はカスタムテキストを表示します。
制限
方程式が描画される場所を制限します。
y=x^2|0<x<5 # 0 < x < 5 の場合にのみ描画
y=\sin(x)|x>0|y>0 # 複数の制限
y=2x|0<=x<=1 # <= および >= がサポートされています
y=\tan(x)|x>-1.5708|x<1.5708 # 数値を使用します (π/2≈1.5708)
⚠️ 重要: 制限にはプレーンな数式を使用し、LaTeX は使用しないでください!
| ✅ 正しい | ❌ 間違い | 理由 |
|---|---|---|
x/2<y |
\frac{x}{2}<y |
LaTeX コマンドは使用できません |
x^0.5<2 |
\sqrt{x}<2 |
\sqrt ではなく ^0.5 を使用します |
0<x<3^0.5 |
0<x<sqrt(3) |
sqrt() → sqr*t |
x>-1.5708 |
x>-pi/2 |
pi → p*i、数値を使用します |
0<x<1 |
\{0<x<1\} |
中括弧は不要です |
プラグインは制限を自動的に {} で囲みます。自分で追加しないでください。
非表示 & 特殊なタグ
f(x)=x^2|hidden # 定義しますが、表示しません
y=f(x)+1 # 非表示の関数を使用します
y=\sin(x)|noline # 点のみ、接続線なし
スタイルの組み合わせ
順序は関係ありません:
y=x^2|red|dashed|0<x<5
(1, 2)|open|blue|label:Start
方程式のタイプ
| タイプ | 例 |
|---|---|
| 陽関数 | y=x^2 |
| 陰関数 | x^2+y^2=25 |
| パラメトリック | (\cos(t), \sin(t)) |
| 極座標 | r=1+\cos(\theta) |
| 区分関数 | y=\{x<0: -x, x\} |
| 点 | (3, 4) |
| 関数定義 | f(x)=x^2 |
⚠️ 極座標方程式は r に関して線形である必要があります
Desmos は、r が線形に現れる極座標方程式のみをサポートしています。
r=1+\cos(\theta) # ✅ r に関して線形
r^2=\cos(2\theta) # ❌ エラー: "must be linear in r"
解決策: パラメトリック曲線に変換します:
# レムニスケート (r² = cos(2θ)) → パラメトリック形式
(\cos(t)\sqrt{\cos(2t)}, \sin(t)\sqrt{\cos(2t)})|blue
パラメトリック曲線の警告
⚠️ 解析エラーを避けるために、括弧で囲まれた式を展開してください:
(2t, 4t(1-t))|blue # ⚠️ 区分関数として誤って解釈される可能性があります
(2t, 4t-4t^2)|blue # ✅ 展開された形式の方が安全です
区分関数
⚠️ 中括弧をバックスラッシュでエスケープします:
y={x<0: -x, x} # ❌ エラー
y=\{x<0: -x, x\} # ✅ 正しい
完全な例
三角関数の位相シフト
```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|d
(原文はここで切り詰められています)
``` 📜 原文 SKILL.md(Claudeが読む英語/中国語)を展開
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() → sqr*t |
x>-1.5708 |
x>-pi/2 |
pi → p*i, 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