スプレッドシートからもグラフは作れます。
Notion Chartsという外部サイトはふたつあり、基本的には以下で記事で使用したサイトの方がグラフ作成は簡単です。
上記の理由に当てはまる場合に、この記事の方法をお試しください。
Notionはノーコードと呼ばれるITスキルの一つ。Notionではできないアイディアの具現化や起業に興味があれば、他のノーコードツールも試してみてください。
» 挫折率の高いプログラミングよりも「ノーコード」でアプリをつくろう
※ノーコード = コーディングせずにWebアプリを作るITスキル
まずはデータベースをgoogleスプレッドシートで作成
パーソナルを指定して、「空白」を選択、新規でスプレッドシートを作成しましょう。
マネーフォワードの資産ページを基にグラフを作成してみます。
https://parlor-dice.com/investment_money_kanri/
スプレッドシートにペタッと貼ります。
notionChartsでグラフを作る場合には、指定のフォームにする必要があります。
指定のフォームは以下のボタンから確認することができます。
それでは、上記のフォームと同様の形にするため、以下の通りスプレッドシートを編集していきます。
- 赤枠を移動して円グラフフォームに合わせる（名称と数値）
- 青枠を編集して数字のみにする（Ctrl＋Fで置換）
- シート名を編集する（そのままでもOK）
次に、スプレッドシートを保存して、公開設定にします。
保存後に、右上の「共有」ボタンを押すと変更できます。
これでスプレッドシートの準備ができました。
URLを使用するので開いたままにしておきましょう。
NotionChartsの設定
スプレッドシートの作成が終わったら、NotionChartsの登録に移ります。
「CREATE A CHART」を押すとデータ選定画面にスライドするので、項目を埋めていくだけで完成します。
それぞれ以下の項目をコピペしていきましょう。
黄色枠のみ見ていただき、スプレッドシートのシート名をコピペしましょう。
タイトル行を含まないように注意してください。
作りたいグラフの種類に合わせて「CHART TYPE」を選択しましょう。
※Line（棒グラフ）の場合は縦横の要素をさらに選択します。
今回はBlueのみで作成します。
各要素を色分けしたい場合には、リストからカラーを選択しましょう。
最後は流れなので駆け足で来ましたが、これで完了です。
notionのpageに貼り付ける
それではnotionのページに貼り付けしてみましょう。
貼り付けの際は「Create embed」の選択を忘れずに。
周りの枠で大きさを変える事ができます。
順番はスプレッドシートに依存するので、変更する場合はスプレッドシートを編集しましょう。
一度作成してしまえば、スプレッドシートを更新することでnotion内グラフを更新可能です。
データ元がスプレッドシートなので活用の幅は広そうですね。
IMPORTXML関数などを使えば、さらに効率よくグラフが作成できるかと思います。
notioncharts スプレッドシートver のまとめ
以上、googleのスプレッドシートからnotion内にグラフを作成する方法でした。
スプレッドシートを常用している場合にはこちらが楽かもしれませんね。
スプレッドシートではなく、notionのデータベースからグラフを作りたい場合はこちらの記事をご参照ください。
【Amazonの電子書籍読み放題サービス】を使って無料で読めます（2022年6月現在）。
Notionはノーコードと呼ばれるITスキルの一つ。Notionではできないアイディアの具現化や起業に興味があれば、他のノーコードツールも試してみてください。
» 挫折率の高いプログラミングよりも「ノーコード」でアプリをつくろう
※ノーコード = コーディングせずにWebアプリを作るITスキル