はじめに

日本全国の「熱狂的ChatGPTプラグインファン」のみなさま、
おつかれさまです。

アニメ『ウマ娘 プリティーダービー ROAD TO THE TOP』(全4話)を見て、
・アドマイヤベガ：「ひぐらし感」が出ちゃってますか？
・テイエムオペラオー：世紀末覇王らしい戦い
・ナリタトップロード：前に進み続ける想い　など、
素晴らしいストーリーに感動したばかりの
マジセミ担当者Aでございます。

→アニメ『ウマ娘 プリティーダービー ROAD TO THE TOP』(全4話他)　再生リスト

今回は、ChatGPTプラグイン「 Show Me Diagrams 」の様子をうかがってみます。

※本記事は、担当者Aの主観により作成されていますので、なにとぞ、そういうことでよろしくお願いします。
※各プラグインの機能強化が進んでいる場合もありますので、最新情報をご確認ください。

ChatGPTプラグイン「 Show Me Diagrams 」の「概要」

「Show Me Diagrams」とは

ChatGPTプラグイン「Show Me Diagrams」は、ChatGPT上でグラフや図を作成できる便利なプラグインです。

グラフやマインドマップなど、テキスト以外の視覚的な情報を出力できます。

テキストベースでのアウトプットに限定されていたChatGPTの機能をビジュアル拡張できることで、情報整理および理解が深まります。

主な機能

グラフ作成機能

■自然言語で図やダイアグラムを作成
・「車の仕組みを視覚的な図表で説明してください。」
・「飛行機が飛ぶ仕組みを図表で示してください。」
・「iOSアプリケーションのライフサイクルを図解してください。」　など

グラフ出力機能

・円グラフ
・シーケンス図
・ガントチャート
・ダイアグラム
・フローチャート
・クラス図　など

グラフ編集機能

・直接、ChatGPTチャット上で図表を編集できる

ユースケース例

・プロジェクトの進捗状況を可視化
・データ分析結果を視覚化
・複雑なプロセスの流れを可視化
・システム構成図を作成　など

ChatGPTプラグイン連携

「Link Reader」や「Wolfram」でデータを収集し、
「Show Me Diagrams」でデータを視覚化できます。

→【ChatGPTプラグイン探訪】コンテンツ読み込みプラグイン「Link Reader」

→【ChatGPTプラグイン探訪】数学＋ナレッジプラグイン「Wolfram」

Mermaidベース

「Show Me Diagrams」は、
JavaScriptベースのグラフ作成ツール「Mermaid」をベースとしています。

→mermaid.js.org

オフィシャルサイト

GitHubリポジトリ

→github.com　→bra1nDump　→show-me-chatgpt-plugin

gptstore.ai

→gptstore.ai　→plugins　→showme-redstarplugin-com

「 Show Me Diagrams 」基本確認編

基本的なグラフ作成を確認してみます。

グラフ作成①「車の仕組みを視覚的な図表で説明してください。」

例題にあった作図依頼をやってみます。

サポート要員として、「Link Reader」＋「Wolfram」を加えてみます。

実行結果

出ました。

「車の仕組み」は、このような感じになるのですね。

図表の説明もしてくれます。

タブで開いた場合

『新しいタブでこの図表を表示します。』をクリックすると、
独立タブで図表が表示されました。

グラフ編集機能

『この図表をオンラインで編集したい場合はこちらからどうぞ。』をクリックすると、
エディタページが開きます。

テキスト修正

矢印マークでリレーションを表しているのですね。

「表示されているテキスト」を編集できます。

フルスクリーン表示

「FULL SCREEN」をクリックすると、
拡大されて表示されます。

保存機能

主要な画像形式で保存できます。

グラフ作成②「飛行機が飛ぶ仕組みを図表で示してください。」

実行結果

飛行機についても、同じような図表が出ました。

図表内の記述は、日本語にしてもらえるようです。

グラフ作成③「iOSアプリケーションのライフサイクルを日本語で図解してください。」

実行結果1

テキスト色の変更は、やってもらえませんでした。

ダークモードではない前提なのかもですね。

実行結果2

別タブで開くと、しっかり見えます。

「 Show Me Diagrams 」グラフ出力編

基本的な図表をサンプルとして出力してみます。

①円グラフ

プロンプト

「2023年3月のブラウザシェア」を取得してください。
結果を円グラフで表示してください。

実行結果

円グラフが出ました。

「Link Reader」が、あちこちを検索してくれているようです。

グラフの色使いが、ちょっと残念ですが、改善に期待します。

②棒グラフ

プロンプト

「国別面積データ」を取得してください。
結果を「棒グラフ」で表示してください。

実行結果

出ました。
Wolframが活躍しました。

(2023/07/06時点では・・・)
ロシアが優勝ですね。

③折れ線グラフ

プロンプト

「Show Me Diagrams」は、折れ線グラフを出力できますか？
何かサンプルで出力してください。

実行結果

出力できました。

④散布図　→出力不可

プロンプト

「Show Me Diagrams」で「散布図」のサンプルグラフを出力してください。

実行結果

『現在のところ、私の能力ではVega-Liteを使用した散布図の生成はサポートしておりません。』
とのことでした。

⑤ヒストグラム

プロンプト

「Show Me Diagrams」で「ヒストグラム」のサンプルグラフを出力してください。

実行結果

出ました。

⑥箱ひげ図　→出力不可

プロンプト

「Show Me Diagrams」で「箱ひげ図」のサンプルグラフを出力してください。

実行結果

『現在のところ「箱ひげ図」の生成に対応している図表言語は提供されていません。』
とのことです。

⑦ピラミッド図

プロンプト

「Show Me Diagrams」で「ピラミッド図」のサンプルグラフを出力してください。

実行結果

「組織図」みたいになるのですね。

⑧組織図

プロンプト

「Show Me Diagrams」で「組織図」のサンプルグラフを出力してください。

実行結果

拡張した組織図を作成できそうです。

⑨ユースケース図

プロンプト

「Show Me Diagrams」で「ユースケース図」のサンプルグラフを出力してください。

実行結果

棒人間が登場しているのがよいですね。

⑩データフロー図

プロンプト

「Show Me Diagrams」で「データフロー図」のサンプルグラフを出力してください。

実行結果

シンプルなやつが出ました。

⑪時系列図

プロンプト

「Show Me Diagrams」で「時系列図」のサンプルグラフを出力してください。

実行結果

カラフルなやつが出ました。

タイムラインごとにタスクを表示できるようです。

⑫シーケンス図

プロンプト

■指示
シーケンス図を作成してください。

■登場オブジェクト
・ユーザー
・Webサーバ
・アプリケーションサーバ
・データベースサーバ
・認証サーバ

実行結果

ざっくりしたオーダーで、作ってくれました。

分かりやすいですね。

⑬ガントチャート

プロンプト

「Show Me Diagrams」で「ガントチャート」のサンプルグラフを出力してください。

実行結果

スケジュールデータを読み込ませれば、
ガントチャートを作ってもらえそうです。

⑭ダイアグラム

プロンプト

「Show Me Diagrams」で「ダイアグラム」のサンプルグラフを出力してください。

実行結果

システム連携構成のようなものが出てきました。

ごちゃごちゃ繋がっている状態をまとめるのに便利そうです。

⑮フローチャート

プロンプト

「Show Me Diagrams」で「フローチャート」のサンプルグラフを出力してください。

実行結果

処理分岐のフローチャートが出ました。

⑯クラス図

プロンプト

「Show Me Diagrams」で「クラス図」のサンプルグラフを出力してください。

実行結果

「アニマル」クラスを継承する「アヒル」「魚」「シマウマ」のクラス図が出ました。

分かりやすいですね。

⑰マインドマップ

プロンプト

「Show Me Diagrams」で「マインドマップ」のサンプルグラフを出力してください。
日本語で作成してください。

実行結果「混み合っていてレンダリングできません」

「Show Me Diagrams」は混雑しているようです。

「Mermaid Live Editor」出力結果

作られていました。

英国の心理学者「トニー・ブザン」さんが人気らしいです。

「 Show Me Diagrams 」いろいろやってみる編

上記のサンプルグラフ出力を踏まえて、
いろいろやってみます。

①フローチャート作成「商品の発注プロセスを可視化」

「ChatGPT3.5に作成してもらったサンプルフローチャート」をグラフにしてもらいます。

プロンプト

■指示
以下を「フローチャート図」としてまとめて出力してください。

■目的
商品の発注プロセスを可視化するためのフローチャートです。

■要素
・開始/終了=プロセスの開始と終了を表す要素
・処理=特定のタスクやアクションを表す要素
・判断=条件や真偽を判断する要素
・データ入力/出力=データの入力や出力を表す要素

■手順
1.開始: プロセスの開始を示します。

2.商品の選択: 発注する商品を選択します。

3.在庫の確認
・在庫がある場合:
・・処理: 在庫があることを示すメッセージを表示します。
・・発注の必要性の判断へ進みます。
・在庫がない場合:
・・処理: 在庫がないことを示すメッセージを表示します。
・・発注プロセスを終了します。

4.発注の必要性の判断
・発注が必要な場合
・・処理: 発注が必要であることを示すメッセージを表示します。
・・発注手続きへ進みます。
・発注が不要な場合:
・・処理: 発注が不要であることを示すメッセージを表示します。
・・プロセスを終了します。

5.発注手続き
・処理: 発注手続きを実行するための手順を示します。
・処理の完了後、発注確認へ進みます。

6.発注確認
・処理: 発注が正常に行われたことを確認するメッセージを表示します。
・終了: プロセスの終了を示します。

実行結果

しっかりフローチャート図にまとめてくれました。

グッドですね。

②ジョジョ４部キャラクター相関図

「Bingに作成してもらったジョジョ４部キャラ情報」から、
相関図を作成してもらいます。

プロンプトVer1

■指示
以下の「キャラクター情報」をまとめて、「キャラクター相関図」として出力してください。

■キャラクター情報
東方仗助は、ジョセフ・ジョースターの隠し子であり、杜王町に住んでいます。彼は、生まれ育った杜王町に異変が起こっていることを知り、町を守るために、仲間たちと幾多のスタンド使いに立ち向かいます。
広瀬康一は、仗助の友人であり、彼もまたスタンド使いです。彼のスタンド「エコーズ」は、音を操る能力を持っています。
虹村億泰は、当初は仗助の敵でしたが、後に親友となります。彼のスタンド「ザ・ハンド」は、空間を消し去る能力を持っています。
岸辺露伴は、漫画家であり、彼もまたスタンド使いです。彼のスタンド「ヘブンズ・ドアー」は、人々の心を本のように開き、記憶や思考を操作する能力を持っています。
空条承太郎は、ジョセフ・ジョースターの孫であり、第3部「スターダストクルセイダース」の主人公です。彼のスタンド「スタープラチナ」は、驚異的な力と速さを持っています。

実行結果Ver1

「ジョセフ・ジョースター」との関係性がちょい残念ですが、
スタンド込みで作成してくれました。

「クレイジーダイヤモンド」はキャラ情報に含まれていなかったのですね・・・。

プロンプトVer2

以下のように修正してください。
・「ジョセフ・ジョースター」→隠し子→「東方仗助」
・「ジョセフ・ジョースター」→孫→「空条承太郎」
・「空条承太郎」→協力→「東方仗助」

実行結果Ver2

できました！

ChatGPTプラグイン「 Show Me Diagrams 」の担当者A総評ジャッジ

評価スター

★★★★★

コメント

「Show Me Diagrams」は、テキスト情報から、いろいろな図表を出力できることがわかりました。

『図表の種類って、こんなにあったんですか？』という驚きもありました。

いろいろな用途で使えそうですが、
特に、いろいろな図表を作成する用事があるエンジニア勢には、便利に使ってもらえそうな感じがしました。

【ChatGPTプラグイン探訪】記事リストポータル

こちらの記事リストポータルページでは、
他の「ChatGPTプラグイン調査記事」も参照できます。

→【ChatGPTプラグイン探訪】記事リストポータル

【お知らせ】「マジセミ」のご紹介

「マジセミ」では、日々、多くのIT関連セミナーを開催しています。

多くのセミナーの中から「ご自身のスキルやビジネスを強化できるセミナー」を見つけて、ぜひ１度、参加してみてください。

マジセミ関連プラットフォーム

※「ご意見」「ご感想」「誤字がありましたよ」「こんな使い方もあるみたいですよ」などありましたら、
マジセミSNS(Facebook or Twitter)まで、お知らせください。