Skip to content
Documentation
Skill

/plotly

Plotlyでインタラクティブなグラフ・ダッシュボードを作成するスキル。ホバー、ズーム、パン対応。 「インタラクティブグラフ」「plotlyでチャート」「操作できるグラフ」等のリクエストで発動。

From plugin
ai-agent-camp
345101 skills8 agents200 commands

Claude Code

$ npx -y skills add minicoohei/ai-agent-camp --skill plotly --agent claude-code

SKILL.md

plotly.SKILL.md
name: plotly
description: "Plotlyでインタラクティブなグラフ・ダッシュボードを作成するスキル。ホバー、ズーム、パン対応。 「インタラクティブグラフ」「plotlyでチャート」「操作できるグラフ」等のリクエストで発動。"
triggers:
  - インタラクティブグラフを作って
  - plotlyでチャート作成
  - 操作できるグラフ
  - plotly
  - ダッシュボード用グラフ
  - 動的なチャート
license: MIT license
metadata:
    skill-author: K-Dense Inc.
source: github.com/K-Dense-AI/claude-scientific-skills@main

Plotly

Python graphing library for creating interactive, publication-quality visualizations with 40+ chart types.

Quick Start

Install Plotly:

uv add plotly

Basic usage with Plotly Express (high-level API):

import plotly.express as px
import pandas as pd

df = pd.DataFrame({
    'x': [1, 2, 3, 4],
    'y': [10, 11, 12, 13]
})

fig = px.scatter(df, x='x', y='y', title='My First Plot')
fig.show()

Choosing Between APIs

Use Plotly Express (px)

For quick, standard visualizations with sensible defaults:

  • Working with pandas DataFrames
  • Creating common chart types (scatter, line, bar, histogram, etc.)
  • Need automatic color encoding and legends
  • Want minimal code (1-5 lines)

See [reference/plotly-express.md](reference/plotly-express.md) for complete guide.

Use Graph Objects (go)

For fine-grained control and custom visualizations:

  • Chart types not in Plotly Express (3D mesh, isosurface, complex financial charts)
  • Building complex multi-trace figures from scratch
  • Need precise control over individual components
  • Creating specialized visualizations with custom shapes and annotations

See [reference/graph-objects.md](reference/graph-objects.md) for complete guide.

**Note:** Plotly Express returns graph objects Figure, so you can combine approaches:

fig = px.scatter(df, x='x', y='y')
fig.update_layout(title='Custom Title')  # Use go methods on px figure
fig.add_hline(y=10)                     # Add shapes

Core Capabilities

1. Chart Types

Plotly supports 40+ chart types organized into categories:

**Basic Charts:** scatter, line, bar, pie, area, bubble

**Statistical Charts:** histogram, box plot, violin, distribution, error bars

**Scientific Charts:** heatmap, contour, ternary, image display

**Financial Charts:** candlestick, OHLC, waterfall, funnel, time series

**Maps:** scatter maps, choropleth, density maps (geographic visualization)

**3D Charts:** scatter3d, surface, mesh, cone, volume

**Specialized:** sunburst, treemap, sankey, parallel coordinates, gauge

For detailed examples and usage of all chart types, see [reference/chart-types.md](reference/chart-types.md).

2. Layouts and Styling

**Subplots:** Create multi-plot figures with shared axes:

from plotly.subplots import make_subplots
import plotly.graph_objects as go

fig = make_subplots(rows=2, cols=2, subplot_titles=('A', 'B', 'C', 'D'))
fig.add_trace(go.Scatter(x=[1, 2], y=[3, 4]), row=1, col=1)

**Templates:** Apply coordinated styling:

fig = px.scatter(df, x='x', y='y', template='plotly_dark')
# Built-in: plotly_white, plotly_dark, ggplot2, seaborn, simple_white

**Customization:** Control every aspect of appearance:

  • Colors (discrete sequences, continuous scales)
  • Fonts and text
  • Axes (ranges, ticks, grids)
  • Legends
  • Margins and sizing
  • Annotations and shapes

For complete layout and styling options, see [reference/layouts-styling.md](reference/layouts-styling.md).

3. Interactivity

Built-in interactive features:

  • Hover tooltips with customizable data
  • Pan and zoom
  • Legend toggling
  • Box/lasso selection
  • Rangesliders for time series
  • Buttons and dropdowns
  • Animations
# Custom hover template
fig.update_traces(
    hovertemplate='<b>%{x}</b><br>Value: %{y:.2f}<extra></extra>'
)

# Add rangeslider
fig.update_xaxes(rangeslider_visible=True)

# Animations
fig = px.scatter(df, x='x', y='y', animation_frame='year')

For complete interactivity guide, see [reference/export-interactivity.md](reference/export-interactivity.md).

4. Export Options

**Interactive HTML:**

fig.write_html('chart.html')                       # Full standalone
fig.write_html('chart.html', include_plotlyjs='cdn')  # Smaller file

**Static Images (requires kaleido):**

uv add kaleido
fig.write_image('chart.png')   # PNG
fig.write_image('chart.pdf')   # PDF
fig.write_image('chart.svg')   # SVG

For complete export options, see [reference/export-interactivity.md](reference/export-interactivity.md).

Common Workflows

Scientific Data Visualization

import plotly.express as px

# Scatter plot with trendline
fig = px.scatter(df, x='temperature', y='yield', trendline='ols')

# Heatmap from matrix
fig = px.imshow(correlation_matrix, text_auto=True, color_continuous_scale='RdBu')

# 3D surface plot
import plotly.graph_objects as go
fig = go.Figure(data=[go.Surface(z=z_data, x=x_data, y=y_data)])

Statistical Analysis

# Distribution comparison
fig = px.histogram(df, x='values', color='group', marginal='box', nbins=30)

# Box plot with all points
fig = px.box(df, x='category', y='value', points='all')

# Violin plot
fig = px.violin(df, x='group', y='measurement', box=True)

Time Series and Financial

# Time series with rangeslider
fig = px.line(df, x='date', y='price')
fig.update_xaxes(rangeslider_visible=True)

# Candlestick chart
import plotly.graph_objects as go
fig = go.Figure(data=[go.Candlestick(
    x=df['date'],
    open=df['open'],
    high=df['high'],
    low=df['low'],
    close=df['close']
)])

Multi-Plot Dashboards

from plotly.subplots import make_subplots
import plotly.graph_objects as go

fig = make_subplots(
    rows=2, cols=2,
    subplot_titles=('Scatter', 'Bar', 'Histogram', 'Box'),
    specs=[[{'type': 'scatter'}, {'type': 'bar'}],
           [{'type': 'histogram'}, {'type': 'box'}]]
)

fig.add_trace(go.Scatter(x=[1, 2, 3], y=[4, 5, 6]), row=1, col=1)
fig.add_trace(go.Bar(x=['A', 'B'], y=[1, 2]), row=1, col=2)
fig.add_trace(go.Histogram(x=data), row=
Read more
@minicoohei
Ships withai-agent-camp

AI Agent Training for Non-Engineers - Complete Guide to Claude Code / Cursor / Codex ### ⚠️ Before you clone Official repository (maintained by the authors): Running AI agents from this repo grants them shell, file-write, and external-API permissions on your

345101 skills8 agents
Get the whole plugin

Stars on GitHub

Momentum

stars in total
345
Star history of minicoohei/ai-agent-camp on GitHub, a chart by star-history.com

Other skills on ai-agent-camp.

ab-test-setup

ab-test-setup

A/Bテストや実験の設計・実装を支援するスキル。 「A/Bテストを設計して」「スプリットテストしたい」「仮説を立ててテストしたい」「バリアントを比較」等のリクエストで発動。 トラッキング実装は analytics-tracking を参照。

agent-designer

agent-designer

マルチエージェントシステムのアーキテクチャ設計ツールキット。 「エージェントを設計して」「マルチエージェント構成」「エージェントのアーキテクチャ」「オーケストレーション設計」等のリクエストで発動。

analytics-tracking

analytics-tracking

アナリティクスのトラッキング設定・改善・監査を支援するスキル。 「トラッキングを設定」「GA4を導入」「コンバージョン計測」「イベントトラッキング」「UTMパラメータ」「GTMの設定」等のリクエストで発動。 A/Bテスト計測は ab-test-setup…

article-writer

article-writer

テーマからアウトライン生成→文体プロファイル適用→Markdown記事出力を行う記事執筆スキル。 挿絵マーカーの自動挿入、style-analyzerプロファイル参照による文体統一に対応。…

banner-creator

banner-creator

各種SNS・広告プラットフォーム向けのバナー/クリエイティブを生成するスキル。 X, Facebook, Instagram, PRTimes, YouTube, LINE, Web広告に対応。…

bigquery-auth

bigquery-auth

GCPプロジェクト単位でBigQuery認証を設定するスキル。 gcloud設定プロファイルで複数プロジェクトを安全に分離管理。 「BigQueryに繋ぎたい」「BQ認証」「gcloud認証」「データ分析の認証設定」等のリクエストで発動。

More skills from other plugins.

context7-cli

context7-cli

Use the ctx7 CLI to fetch library documentation and configure Context7 MCP. Activate when the user mentions "ctx7" or "context7",…

context713d64k
@upstash@upstashInstall Skill
docs-components

docs-components

Comprehensive MDX component patterns (Note, Pitfall, DeepDive, Recipes, etc.) for all documentation types. Authoritative source…

@reactjs@reactjsInstall Skill
codebase-wiki

codebase-wiki

How to work in a Codebase Wiki project (the `codebase-wiki` starter pack): an agent-authored, source-grounded wiki of the…

@inkeep@inkeepInstall Skill

Questions about plotly.

Which coding agents can use plotly?
plotly installs in Claude Code, Codex, Cursor, Gemini CLI, GitHub Copilot, OpenCode and Windsurf with the skills CLI, using each agent's flag shown on this page. Flowy's auto-invocation, which fires a skill when your prompt matches, runs in Claude Code only.