mcpField
D
d3-visualization

d3-visualization

github.com/nexu-ioデータ・データベース104.6k3.1k 回インストール今日更新
リポジトリ

d3-visualization について

d3-visualizationは、D3.jsのチャートやインタラクティブな可視化の作成をエージェントに教えるスキルです。複数のチャート形式と手法の例を含み、ダッシュボードやレポートなどに活用できます。

主な機能

  1. 01D3チャートの生成
  2. 02インタラクティブな可視化
  3. 03多様なチャート形式
  4. 04手法のサンプル

活用シーン

  1. 01編集用ダッシュボードの作成
  2. 02レポートへのチャート追加
  3. 03データ豊富なプロトタイプ作成
  4. 04説明用グラフィックの生成

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/nexu-io/open-design --skill d3-visualization

インストール後、Claude Code で/d3-visualizationを入力して読み込まれたか確認します。

詳細

d3-visualization

@jiannanya のキュレーションによるものです。

概要

エージェントが D3 のチャートやインタラクティブなデータビジュアライゼーションを作成できるようにします。さまざまな種類のチャートや手法を網羅した、包括的な D3.js スキルです。エージェントに専門家レベルの知識を与え、複雑でインタラクティブなビジュアライゼーションを生成できるようにします。編集用ダッシュボード、レポート、データを豊富に含むプロトタイプ、解説用グラフィックに役立ちます。

ソース

使用方法

このカタログエントリーは OpenDesign でスキルを紹介し、計画中にエージェントがスキルを見つけられるようにします。元のアセット、スクリプト、リファレンスドキュメントを含む上流のワークフロー全体を実行するには、上流バンドルを現在使用中のエージェントのスキルディレクトリにインストールしてください。

# Inspect the upstream README for exact paths
open https://github.com/jiannanya/snow-d3/

# Clone or copy the snow-d3/ folder into your workspace's skills/ directory
git clone https://github.com/jiannanya/snow-d3.git skills/snow-d3

次に、スキル名（d3-visualization）を指定するか、このスキルのフロントマターに記載されているトリガーフレーズのいずれかを使って、このスキルを呼び出すようエージェントに依頼してください。例：

「売上データ用にズーム可能なツリーマップを作成して」 「例 07 のような力指向ネットワークグラフを、独自のデータセットで作成して」 「D3 でカレンダーヒートマップを生成して」

コメント

Markdown 対応