Notion Plotly

チェックボックス

タグ

作成者

おすすめ度

活用難度

テキスト

• https://notion-plotly.netlify.app/ を使ったグラフURLを作成するサンプルです

• 解説記事: Notionのデータベースのデータを可視化するグラフURLを作成する | Web Scratch

使い方

1. 参照用のインデックスデータベース を作成します
• このデータベースは、サンプルデータベースの値を集めるためだけに使います

2. インデックスデータベース に 集計用 という行を追加します
• この行にグラフ化したいサンプルデータベースの値を集めていきます

3. サンプルデータベース に インデックスデータベース へのRelationを追加します

4. サンプルデータベース の全ての行の インデックスデータベース のRelationに 集計用 への参照を設定します
• この時 サンプルデータベース のフィルターで 集計用 への参照をもつものだけ表示しておくと、次からサンプルデータベースに値を追加したときに自動的に参照が追加されます
• フィルターの仕組みの解説: Notionで「ほぼ日」手帳作ってみた📖 #まいにちNotion Ep.12 - YouTube

5. インデックスデータベース にRollupを追加し、グラフ化したいデータを集める
• この時のRollupの計算は”オリジナルを表示する”を選ぶ

6. インデックスデータベース に関数を追加し、グラフURLを作る
• "https://notion-plotly.netlify.app/pie.html?values=" + prop("数値") + "&labels=" + prop("支出項目")
• 📝 labelsに & や特定の文字が入れられないため、 replaceAll などを使って削る

7. 作成したグラフURLをクリックするとグラフが見られる
1. EmbedでグラフURLを埋め込むとNotion上でも表示できる(自動更新はされない)

参照用のデータベース

グラフ化したいデータベース

棒グラフのサンプル