jpskill.com
🛠️ 開発・MCP コミュニティ

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.

⚡ おすすめ: コマンド1行でインストール(60秒)

下記のコマンドをコピーしてターミナル(Mac/Linux)または PowerShell(Windows)に貼り付けてください。 ダウンロード → 解凍 → 配置まで全自動。

🍎 Mac / 🐧 Linux
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
🪟 Windows (PowerShell)
$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. 1. 下の青いボタンを押して desmos-graphing.zip をダウンロード
  2. 2. ZIPファイルをダブルクリックで解凍 → desmos-graphing フォルダができる
  3. 3. そのフォルダを C:\Users\あなたの名前\.claude\skills\(Win)または ~/.claude/skills/(Mac)へ移動
  4. 4. Claude Code を再起動

⚠️ ダウンロード・利用は自己責任でお願いします。当サイトは内容・動作・安全性について責任を負いません。

🎯 このSkillでできること

下記の説明文を読むと、このSkillがあなたに何をしてくれるかが分かります。Claudeにこの分野の依頼をすると、自動で発動します。

📦 インストール方法 (3ステップ)

  1. 1. 上の「ダウンロード」ボタンを押して .skill ファイルを取得
  2. 2. ファイル名の拡張子を .skill から .zip に変えて展開(macは自動展開可)
  3. 3. 展開してできたフォルダを、ホームフォルダの .claude/skills/ に置く
    • · macOS / Linux: ~/.claude/skills/
    • · Windows: %USERPROFILE%\.claude\skills\

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