Observable：D3.js作者が作ったデータ可視化ノートブック
はじめに Observable（オブザーバブル）は、D3.jsの作者であるMike Bostock（マイク・ボストック）が開発した、JavaScriptベースのデータ分析・可視化ノートブックプラットフォームです。ブラウザ上でリアクティブなコードを記述し、インタラクティブなデータ可視化をすぐに作成できる環境を提供します。 デジタル・ヒューマニティーズ（DH）の分野では、研究データの探索的分析やインタラクティブな可視化の作成において、Observableが強力なツールとして注目されています。 Observableの特徴 リアクティブノートブック Observableのノートブックは、Jupyter Notebookに似た概念ですが、JavaScriptベースでリアクティブな実行モデルを採用しています。 リアクティブ実行：セルの値が変更されると、依存するセルが自動的に再実行される 即時プレビュー：コードを書くとリアルタイムで結果が表示される セル間の依存関係：変数を通じてセル間でデータを共有 インポート機能：他のノートブックからセルを再利用可能 // Observableのセル例 viewof year = Inputs.range([1900, 2025], {step: 1, value: 2000}) Observable Plot Observable Plotは、Observableチームが開発した高レベルの可視化ライブラリです。D3.jsの強力な機能を、より簡潔なAPIで利用できます。 // Observable Plotによるデータ可視化 Plot.plot({ marks: [ Plot.barY(data, {x: "category", y: "count", fill: "type"}), Plot.ruleY([0]) ], color: {legend: true} }) 主な特徴まとめ 特徴 説明 言語 JavaScript / TypeScript 可視化 Observable Plot, D3.js統合 データ入力 CSV, JSON, SQLite, API コラボレーション チーム共有、コメント機能 公開 ノートブックの公開・埋め込み ライセンス ISC License Observable Framework 2024年にリリースされたObservable Frameworkは、データアプリケーションを構築するための静的サイトジェネレーターです。 特徴 データローダー：Python、R、SQL、JavaScriptなど任意の言語でデータを前処理 Markdownベース：MarkdownファイルにJavaScriptコードを埋め込み 静的ビルド：ビルド時にデータを処理し、高速な静的サイトを生成 セルフホスティング：自分のサーバーやCDNにデプロイ可能 # Observable Frameworkの例 const data = await FileAttachment("data/research_data.csv").csv({typed: true}); Plot.plot({ marks: [Plot.dot(data, {x: "year", y: "value", stroke: "category"})] }) DHにおける活用方法 1. テキスト分析の可視化 文学作品の語彙分析、単語頻度の時系列変化、テキスト間の類似度マッピングなどを、インタラクティブな可視化として作成できます。 ...