Manga Graph: 漫画のグラフDBを作成してみた話
はじめに
漫画作品の複雑な関係性を可視化するため、Neo4jを活用したグラフデータベース「Manga Graph」を開発しました。
本記事では、メディア芸術データベースのデータセットを利用して、漫画、作者、雑誌の関係性をグラフ構造で表現し、API経由でデータを提供するシステムの構築について紹介します。
プロジェクト概要
Manga Graphは以下の2つのリポジトリで構成されています：
- manga-graph: Neo4j、Python、FastAPIを使用したAPI形式のバックエンド
- manga-graph-frontend: Vue.js + Cytoscape.jsによるグラフ可視化フロントエンド
実際のデモはManga Graph Visualizerとして公開されており、インタラクティブなグラフ操作が可能です。
またローカルで動かすこともできるので、良ければぜひ上記のGitHubリポジトリのREADMEを参照して試してみてください。
Manga Graph Visualizerのデモ
バックエンド(manga-graph)
技術スタック
- Python 3.12.7
- FastAPI
- Neo4j（グラフデータベース）
- Docker & Docker Compose
フロントエンド（manga-graph-frontend）
技術スタック
- Vue.js 3（Composition API）
- Cytoscape.js（グラフ描画）
- Vite
- Axios
機能
- 漫画作品の検索機能
- インタラクティブなグラフ可視化
- ノードの色、形分け表示（作品：白（検索したものだけ赤枠）、作者：青、雑誌：オレンジ、出版社: 紫）
- ノードクリックによる詳細表示
データソースとグラフ構造
使用データ
-
メディア芸術データベース：
国立美術館国立アートリサーチセンターが提供する、漫画、アニメ、ゲームなどのメディア芸術に関するデータベース。
グラフモデル
作品📗 ←→ 作者👤（創作関係）
作品📗 ←→ 雑誌📙（掲載関係）
雑誌📙 ←→ 出版社🏢（発行関係）
Neo4jのグラフデータベースにより、これらの多対多の関係を効率的に表現・検索できます。
工夫点
Manga Graph Visualizerでは同時期に同じ雑誌で掲載していた作品がノードとして選択されるようにしています。
この「同時期」というのは以下のようなJaccard類似度を元に計算しています。
この類似度が高い順で表示をしています。
これによって連載期間が長い作品が常にノードとして現れるようなことがなくなり、関係性の深い作品がノードとして表示されるようになっています。
苦労した点
グラフ構造の設計
- メディア芸術データベースでは、作品、作者、雑誌の関係性が複雑で、どのようにグラフ構造に落とし込むかを検討する必要がありました。
- 結果としてデータ構造を生のファイルを分析し、スクリプトにより、作品と作者、作品と雑誌の関係性を抽出し、グラフに変換しました。
データのクレンジング
- メディア芸術データベースのデータは、表記揺れや欠損値が多く、正規化が必要でした。
- 例えば、同一の作者が「尾田栄一郎」と「おだえいいちろう」として登録されているケースがあり、これらが別のノードとして扱われてしまう問題がありました。
- 筆者が作成した漢字変換ライブラリkanjiconvを使うことで、ある程度の名寄せを行い重複ノードを減らすようにしました。
※上記はメディア芸術データベースを貶めるものではなく、あくまでデータの特性の話です。データベース自体は非常に有用なリソースです。
（なかなかこんなに大量のデータを無償で公開し、メンテまでしていただけることは稀なので感謝しかありません。）
実装の課題と限界
苦労した点と関連しますが、現在のシステムにはいくつかの課題があります。
1. 表記揺れの問題
- 作者名や作品名の表記統一が不完全
- 「さとう」「佐藤」「サトウ」などの異なる表記が別ノードとして扱われる。（ただし複数の作者が手がけた作品だと別人物の可能性もある）
- 今後、名寄せアルゴリズムの改良が必要
2. Relationのエッジ問題
- 関係性の種類が限定的
- エッジの重みが不足
- より詳細な関係性モデリングが必要
3. データ品質
- 欠損データやノイズデータの混入
- データクレンジングの強化が必要
応用例：GraphRAGによるレコメンド
このあたりは別の記事にて詳しく解説予定ですが、Manga Graphの応用例として、GraphRAG（Graph Retrieval-Augmented Generation）を用いた漫画レコメンドシステムが考えられます。
この記事での詳細は省きますが、例えば以下のようなアプローチが可能です。
GraphRAGのアプローチ
- グラフ構造の活用：ユーザーの好みの作品から関連作品をグラフ探索
- コンテキスト生成：関係性情報を含むリッチなコンテキストを構築
- LLMによる推論：グラフ情報を基にした自然言語での推薦理由生成
今後の展望
-
データ品質向上
- 名寄せアルゴリズムの実装
- データクレンジングパイプラインの構築
-
関係性モデルの拡張
- 影響関係や類似度の定量化
-
ノードへの特徴の追加
- 作品の概要の追加
- 作品へのレビューの追加
-
AI機能の強化
- GraphRAGを活用したレコメンド機能
- 自然言語生成による作品紹介
-
パフォーマンス最適化
- 大規模データセットへの対応
- リアルタイム検索の高速化
-
応用先の強化
- グラフ構造を元にした応用先を色々と考えたいです。
- もしアイデアがあればコメントやGitHubのISSUEなどで教えていただけると嬉しいです。
まとめ
Manga Graphは、メディア芸術データベースを活用して漫画の関係性をグラフ構造で表現する試みです。Neo4j、FastAPI、Vue.jsを組み合わせることで、インタラクティブな可視化システムを構築できました。
まだ改善点は多いものの、GraphRAGなどの最新AI技術との組み合わせにより、従来にない漫画レコメンドシステムの可能性を示しています。今後もデータ品質の向上と機能拡張を続けていく予定です。
よかったら、ぜひManga Graph Visualizerで実際のグラフ可視化をお試しいただけると嬉しいです。
またプロジェクトとしてはまだまだな部分が多くあるため、GitHubへのIssueやPull Requestで改善点などいただけると非常に喜びます。
Manga Graph Visualizerの注意点
- 最低限のスペックのサーバーを使ってるので、動作が重かったり落ちてしまったらごめんなさい。
- グラフDBのデータを格納するNeo4jのDBはFreeプランを使用しています。そのため今回のデモはメディア芸術データベースの入っている漫画データの60%ほどしか表示されません。
- ローカルでbuildしていただければ全てのデータが表示されますので、よければ試してみてください。
おまけ: 諦めた機能
作品の表紙画像の表示
当初、グラフを表示するときに作品ノードをその漫画の表紙画像にするとわかりやすいのではないかと考え、APIも途中まで作成しました。
ただ途中で著作権的にグレーだなと思い直して、表示は取り止めました。
（このあたり、もし詳しい方いたら教えてください。）
Discussion