NotionのFormulaで完了した数の進捗バーを作る

こういうのを作る。アニメの話数を記録するとかに使えそう。

(以下、仕方なくJSとして構文ハイライトしてるが、決してJSではないので注意)

準備

まず「全話」と「見た話数」という数字プロパティを作る。

次に「進捗」というFormulaプロパティを作り、以下の式を入れる。

prop("見た話数") / prop("全話")

数字の形式を Percent にすれば、どれくらい見たかのパーセンテージを出せる。

バーを作る

で、「進捗バー」というフォーミュラプロパティを作り、以下の内容を入力する。

if(prop("進捗") > 1, "😱 ERROR", slice("■■■■■■■■■■", 0, floor(prop("進捗") * 10)) + slice("□□□□□□□□□□", 0, ceil((1 - prop("進捗")) * 10)) + " " + if(empty(prop("見た話数")), "0", format(round(prop("進捗") * 100))) + "%")

NotionのFormulaは一行で書かないといけないので読みづらい。普通にJS使わせてほしい。

解説

エラーを出す

if(prop("進捗") > 1, "😱 ERROR", 残りのコード)

進捗が100%を超えることは想定していないので、バーは出さない。

この判定を付けないと、誤入力でバーが伸び放題になってしまう。

バー本体

slice("■■■■■■■■■■", 0, floor(prop("進捗") * 10))

進捗を10倍して、■をぶった斬る。

slice("□□□□□□□□□□", 0, ceil((1 - prop("進捗")) * 10))

□については反対の割合でぶった斬る。

empty判定

if(empty(prop("見た話数")), "0", format(round(prop("進捗") * 100)))

未入力時には計算できないので、代わりにゼロを出すようにする。

結果

見た話数は切り上げたのに対して、残りは切り捨てているので、100%にならない限り満タンにならない。

表だとこんな感じ。

入力をミスるとエラーが出る。

参考

このサイトの数式だと四捨五入してしまっているので、切り捨てる方針に変えた。

あと「0」の判定は実際やってみると不要だったし、これじゃ未入力に対応できないので、emptyに書き換えた。

こういうの基礎的な算数って、テストしてから初歩的な間違いに気づくんだよね。