Notion进度条

如何创建Notion进度条:让数据看得见

Notion进度条是一个数据可视化小工具,可以用进度条来表示项目进度或日期进度。本文将会讲解如何在Notion中使用Database表格数据创建进度条,你还可以学会根据自己的喜好来改变Notion进度条的外观。在开始本教程之前,建议不熟悉Notion的同学提前阅读一下新手入门指南,后续学习起来会轻松一点。

文章内容

Notion进度条长什么样子?

进度条一般在Database数据表格中生成,主要作用是将百分比或日程进度转换成图形,让数据一目了然。以下是一些比较常用的进度条样式。

Notion进度条示例
Notion进度条示例

图中第3、第4列为Notion自带进度条,体现了Notion一贯的简洁画风;

第5、6列为个性化定制的进度条,其中第5列为emoji表情进度条,第6列为特殊符号进度条。如果看腻了软件自带的进度条样式,你可以尝试使用任何喜欢的符号来制作进度条。

除了使用数值生成进度条,Notion还可以生成日期进度条,如下图所示,它帮你更好地掌握项目的时间进度。

Notion日期进度条
Notion日期进度条

看到这里,你可能已经跃跃欲试了,那么请跟着下面的教程一起来制作好看的进度条吧!

如何生成Notion内置进度条

生成内置进度条的操作步骤如下:
  • 创建一个Database表格;
  • 其中一列的Type类型设置为Number(或Formula),代表当前的进度。此处我用0-100来表示进度,0代表当前没有进度,100代表已经完成,我把这一列命名为% value。你可以参考我的做法,点击查看如何将文本或数值转化为0-100的整数
  • 点击表头列名弹出菜单,点击Edit property
创建Notion内置进度条
创建一列0-100的数代表进度,点击列名打开菜单,然后点击Edit property设置属性
  • Show as下方,选择BarRing即可生成进度条。其中,Bar是生成条状进度条,Ring是环状进度条。
  • 你可以通过Show number开关来决定是否在进度条旁边显示数字。
Bar是条状进度条,Ring是环状进度条
Bar是条状进度条,Ring是环状进度条

Notion进度条代模板和代码

什么?你说用个效率软件还需要学代码?我不学了!

先别急着关掉浏览器,耐心点!

写代码确实比较麻烦,但是不用你自己写呀,我都帮你准备好了,你负责复制和粘贴就好!

制作Emoji进度条

首先选择意义相反、颜色对比强烈的两个emoji表情,这里我选择了金色月球和黑色月球

参考上文生成内置进度条的操作,先创建一个Database表格,并把其中一列设置为Number类型,并用0-100来表示进度,并将这一列命名为% value

另起一列,设置Type为Fomula类型,并粘贴以下公式:


if(prop("% value") <= 0, "❌", if(prop("% value") >= 100, "✅", slice("🌕🌕🌕🌕🌕🌕🌕🌕🌕🌕", 0, round(prop("% value") * 0.1) * 2) + slice("🌑🌑🌑🌑🌑🌑🌑🌑🌑🌑", 0, 20 - round(prop("% value") * 0.1) * 2) + " " + if(prop("% value") < 10, "00", if(prop("% value") < 100, "0", "")) + if(prop("% value") == 0, "0", format(round(prop("% value")))) + " %")) 
    

我们的Emoji进度条就做好啦!

Emoji进度条
Emoji进度条

如果想用别的emoji符号来制作进度条,你可以直接替换掉代码中的emoji。(代码只适用于emoji进度条,如果想替换成文字符号,请看下文用其他符号制作进度条)

用特殊符号制作进度条(附样式和代码)

用其他特殊符号制作进度条的具体步骤和上面类似,也需要先创建Database表格,并且要有一列0-100数值代表进度(命名为% value)。

然后再新建一列,并输入以下任意公式,即可得到由特殊符号组成的进度条:

% value

进度条

代码

80

⣿⣿⣿⣿⣿⣿⣿⣿⣀⣀ 080 %

if(prop("% value") <= 0,"❌",if(prop("% value") >= 100,"✅",slice("⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿", 0, round(prop("% value") * 0.1) )+slice("⣀⣀⣀⣀⣀⣀⣀⣀⣀⣀", 0, 10 - round(prop("% value") * 0.1) )+" "+if( prop("% value") < 10, "00", if( prop("% value") < 100, "0", "" ) )+if( prop("% value") == 0, "0", format(round(prop("% value"))) )+" %"))

71

■■■■■■■□□□

slice("■■■■■■■■■■", 0, round(prop("% value") * 0.1) )+slice("□□□□□□□□□□", 0, 10 - round(prop("% value") * 0.1) )

50

50 ▱▱▱▱▱

if( prop("% value") == 0, "0", format(round(prop("% value"))) )+" "+slice("▱▱▱▱▱▱▱▱▱▱", 0, round(prop("% value") * 0.1) )

60

▮▮▮▮▮▮▯▯▯▯

if(prop("% value") <= 0,"",if(prop("% value") >= 100,"✖︎",slice("▮▮▮▮▮▮▮▮▮▮", 0, round(prop("% value") * 0.1) )+slice("▯▯▯▯▯▯▯▯▯▯", 0, 10 - round(prop("% value") * 0.1) )))

77

077 ◉◉◉◉◉◉◉◉

if( prop("% value") < 10, "00", if( prop("% value") < 100, "0", "" ) )+if( prop("% value") == 0, "0", format(round(prop("% value"))) )+" "+slice("◉◉◉◉◉◉◉◉◉◉", 0, round(prop("% value") * 0.1) )

0

100

×

if(prop("% value") <= 0,"×",if(prop("% value") >= 100,"✓",if( prop("% value") < 10, "00", if( prop("% value") < 100, "0", "" ) )+if( prop("% value") == 0, "0", format(round(prop("% value"))) )+" "+slice("◉◉◉◉◉◉◉◉◉◉", 0, round(prop("% value") * 0.1) )))

Notion日期进度条模板和代码

日期进度条制作步骤

首先创建一个Database表格,并把其中两列设置为Date格式,分别命名为“开始日期”和“结束日期”。

设置开始日期和结束日期
设置开始日期和结束日期

另起一列,设置类型为Formula,用于显示日期进度条。复制粘贴以下公式,即可得到经典样式的日期进度条。

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, "●—————————— 0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("——————————", 0, floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "●" + slice("——————————", 0, 10 - floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + " " + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "——————————● 100%")), "")
				
			
经典样式日期进度条
经典样式日期进度条

日期进度条模板和代码

进度条模板

公式(代码)

——————————● 100%
————————●—— 84%
———●——————— 38%
———●——————— 32%
●—————————— 0%

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, "●—————————— 0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("——————————", 0, floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "●" + slice("——————————", 0, 10 - floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + " " + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "——————————● 100%")), "")
				
			

▒▒▒▒▒▒▒▒▒▒| 100%
▒▒▒▒▒▒▒▒|░░ 84%
▒▒▒|░░░░░░░ 38%
▒▒▒|░░░░░░░ 32%
|░░░░░░░░░░ 0%

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, "|░░░░░░░░░░ 0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("▒▒▒▒▒▒▒▒▒▒", 0, floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "|" + slice("░░░░░░░░░░", 0, 10 - floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + " " + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "▒▒▒▒▒▒▒▒▒▒| 100%")), "")
				
			

■■■■■■■■■■ 100%
■■■■■■■■□□ 84%
■■■□□□□□□□ 38%
■■■□□□□□□□ 32%
□□□□□□□□□□ 0%

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, "□□□□□□□□□□ 0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("■■■■■■■■■■", 0, floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + slice("□□□□□□□□□□", 0, 10 - floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + " " + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "■■■■■■■■■■ 100%")), "")
				
			

▌▌▌▌▌▌▌▌▌▌ 100%
▌▌▌▌▌▌▌▌84%
▌▌▌38%
▌▌▌32%
0%

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, "0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("▌▌▌▌▌▌▌▌▌▌", 0, floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "▌▌▌▌▌▌▌▌▌▌ 100%")), "")
				
			

❒❒❒❒❒❒❒❒❒❒ ■ 100%
❒❒❒❒❒❒❒❒ ■ ❒❒ 84%
❒❒❒ ■ ❒❒❒❒❒❒❒ 38%
❒❒❒ ■ ❒❒❒❒❒❒❒ 32%
■ ❒❒❒❒❒❒❒❒❒❒ 0%

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, " ■ ❒❒❒❒❒❒❒❒❒❒ 0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("❒❒❒❒❒❒❒❒❒❒", 0, floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + " ■ " + slice("❒❒❒❒❒❒❒❒❒❒", 0, 10 - floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + " " + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "❒❒❒❒❒❒❒❒❒❒ ■ 100%")), "")
				
			

||||||||||||||||||||🁢 100%
||||||||||||||||🁢|||| 84%
|||||||🁢||||||||||||| 38%
||||||🁢|||||||||||||| 32%
🁢|||||||||||||||||||| 0%

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, "🁢|||||||||||||||||||| 0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("||||||||||||||||||||", 0, floor(20 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "🁢" + slice("||||||||||||||||||||", 0, 20 - floor(20 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + " " + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "||||||||||||||||||||🁢 100%")), "")
				
			

|||||||||||||||||||| 100%
||||||||||||||||🁢 84%
|||||||🁢 38%
||||||🁢 32%
🁢 0%

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, "0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("||||||||||||||||||||", 0, floor(20 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "🁢 " + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "|||||||||||||||||||| 100%")), "")
				
			

▮▮▮▮▮▮▮▮▮▮ 100%
▮▮▮▮▮▮▮▮▯▯ 84%
▮▮▮▯▯▯▯▯▯▯ 38%
▮▮▮▯▯▯▯▯▯▯ 32%
▯▯▯▯▯▯▯▯▯▯ 0%

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, "▯▯▯▯▯▯▯▯▯▯ 0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("▮▮▮▮▮▮▮▮▮▮", 0, floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + slice("▯▯▯▯▯▯▯▯▯▯", 0, 10 - floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + " " + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "▮▮▮▮▮▮▮▮▮▮ 100%")), "")
				
			

⭘⭘⭘⭘⭘⭘⭘⭘⭘⭘ 100%
⭘⭘⭘⭘⭘⭘⭘⭘ 84%
⭘⭘⭘ 38%
⭘⭘⭘ 32%
0%

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, "0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("⭘⭘⭘⭘⭘⭘⭘⭘⭘⭘", 0, floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + " " + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "⭘⭘⭘⭘⭘⭘⭘⭘⭘⭘ 100%")), "")
				
			

❍❍❍❍❍❍❍❍❍❍● 100%
❍❍❍❍❍❍❍❍●❍❍ 84%
❍❍❍●❍❍❍❍❍❍❍ 38%
❍❍❍●❍❍❍❍❍❍❍ 32%
●❍❍❍❍❍❍❍❍❍❍ 0%

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, "●❍❍❍❍❍❍❍❍❍❍ 0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("❍❍❍❍❍❍❍❍❍❍", 0, floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "●" + slice("❍❍❍❍❍❍❍❍❍❍", 0, 10 - floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + " " + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "❍❍❍❍❍❍❍❍❍❍● 100%")), "")
				
			

▁▁▁▁▁▁▁▁▁▁▅ 100%
▁▁▁▁▁▁▁▁▅▁▁ 84%
▁▁▁▅▁▁▁▁▁▁▁ 38%
▁▁▁▅▁▁▁▁▁▁▁ 32%
▅▁▁▁▁▁▁▁▁▁▁ 0%

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, "▅▁▁▁▁▁▁▁▁▁▁ 0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("▁▁▁▁▁▁▁▁▁▁", 0, floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "▅" + slice("▁▁▁▁▁▁▁▁▁▁", 0, 10 - floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + " " + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "▁▁▁▁▁▁▁▁▁▁▅ 100%")), "")
				
			

▄▄▄▄▄▄▄▄▄▄▀ 100%
▄▄▄▄▄▄▄▄▀▄▄ 84%
▄▄▄▀▄▄▄▄▄▄▄ 38%
▄▄▄▀▄▄▄▄▄▄▄ 32%
▀▄▄▄▄▄▄▄▄▄▄ 0%

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, "▀▄▄▄▄▄▄▄▄▄▄ 0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("▄▄▄▄▄▄▄▄▄▄", 0, floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "▀" + slice("▄▄▄▄▄▄▄▄▄▄", 0, 10 - floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + " " + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "▄▄▄▄▄▄▄▄▄▄▀ 100%")), "")
				
			

፨፨፨፨፨፨፨፨፨፨ 100%
፨፨፨፨፨፨፨፨჻ 84%
፨፨፨჻ 38%
፨፨፨჻ 32%
჻ 0%

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, "0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("፨፨፨፨፨፨፨፨፨፨", 0, floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "჻ " + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "፨፨፨፨፨፨፨፨፨፨ 100%")), "")
				
			

⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤ 100%
⬤⬤⬤⬤⬤⬤⬤⬤◯◯ 84%
⬤⬤⬤◯◯◯◯◯◯◯ 38%
⬤⬤⬤◯◯◯◯◯◯◯ 32%
◯◯◯◯◯◯◯◯◯◯ 0%

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, "◯◯◯◯◯◯◯◯◯◯ 0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤", 0, floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + slice("◯◯◯◯◯◯◯◯◯◯", 0, 10 - floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + " " + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤ 100%")), "")
				
			

__________▃ 100%
________▃__ 84%
___▃_______ 38%
___▃_______ 32%
▃__________ 0%

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, "▃__________ 0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("__________", 0, floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "▃" + slice("__________", 0, 10 - floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + " " + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "__________▃ 100%")), "")
				
			

⠤⠴⠾⠿⠿⠿⠿⠿⠿⠿ 100%
⠤⠴⠾⠿⠿⠿⠿⠿ 84%
⠤⠴⠾ 38%
⠤⠴⠾ 32%
0%

				
					if(not empty(prop("开始日期")) and not empty(prop("结束日期")), if(dateBetween(prop("开始日期"), now(), "days") > 0, "0%", if(dateBetween(prop("结束日期"), now(), "days") > -1, slice("⠤⠴⠾⠿⠿⠿⠿⠿⠿⠿", 0, floor(10 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + " " + format(floor(100 * dateBetween(now(), prop("开始日期"), "days") / dateBetween(prop("结束日期"), prop("开始日期"), "days"))) + "%", "⠤⠴⠾⠿⠿⠿⠿⠿⠿⠿ 100%")), "")
				
			
  • 注1:你可以通过替换代码中的符号来改变进度条的样式
  • 注2:如果你不想以“开始日期”或“结束日期”作为列名,可在代码中进行替换。

如何将文本或分数转化为0-100的整数

上文中我一直强调使用0-100之间的数来代表进度,其中0代表没有进展,100代表完成。

但是你手上的Database表格,可能是别的方式来表示进度,一个个修改的话会非常麻烦。

因此,在这里提供一串公式,可以将Database中的文字或分数转换成0-100之间的整数:

  • 首先,假设当前Database中装有进度数值的列名为“进度”;
  • 在此基础上,创建一个新列,命名为% value,并设置Type为Formula,点击Edit formula并粘贴以下公式:
				
					round(if(toNumber(prop("进度")) != 0 and empty(prop("进度")), 0, max(min(if(not test(prop("进度"), "^((\\s*\\d+\\s*\\/\\s*\\d+\\s*)|(\\s*\\d+\\s*))\\s*\\%?\\s*$"), 0, if(test(prop("进度"), "^((\\s*\\d+\\s*\\/\\s*\\d+\\s*))\\s*\\%?\\s*$"), toNumber(replace(replace(prop("进度"), "^\\s*", ""), "\\s*\\/\\s*\\d+\\s*\\s*\\%?\\s*$", "")) * 100 / toNumber(replace(replace(prop("进度"), "^(\\s*\\d+\\s*\\/\\s*)", ""), "\\s*\\s*\\%?\\s*$", "")), toNumber(replace(replace(prop("进度"), "^\\s*", ""), "\\s*\\s*\\%?\\s*$", "")))), 100), 0)))
				
			

上面的公式可以涵盖大多数情形,如果发现公式报错(特别是Unexpected token in json at position #这样的报错),可以将代码中正则表达式里的\\全部替换为\

如果以上代码无法满足你的需求,可以自行研究正则表达式并进行修改,这不是一件特别困难的事情。

转换后的效果如下图所示:

Database将文字或分数转换为0-100的整数
Database将文字或分数转换为0-100的整数

最后

最后来个步骤小结。

使用Notion内置的进度条:

  1. 创建Database表格;
  2. 设置其中一列0-100整数,并命名(例如% value);
  3. 点击% value列表头,点击Edit property并选择Bar(条状)或Ring(环状),完成。

使用Emoji或特殊符号制作进度条:

  1. 创建Database表格;
  2. 设置其中一列0-100整数,并命名(例如% value);
  3. 另起新列,并插入上文公式:

制作日期进度条:

  • 创建Database表格
  • 设置其中两列为Date格式,并命名(eg. “开始日期”和“结束日期”)
  • 另起新列并设置为Formula格式,插入你喜欢的日期进度条模板及其对应公式

因为自己定制进度条需要使用不少公式,还涉及到正则表达式等概念,想要全面掌握的确不容易。我的建议是收藏本页,或转发到微信文件助手里,以后有需要可以随时查阅。

参考文章:

Comment reactions, progress bars & more. 作者:Notion官方

Notion – Progress Bars Generator. 作者:Théry Fouchter

Leave a Comment

Your email address will not be published. Required fields are marked *

最新文章

Notion倒计时 - 文章封面
如何实现既实用又美观的Notion倒计时功能

作为一个有整理癖的理科男,我喜欢把Notion当成一个All-in-One的生活工作一体化工具来使用,简单来说就是我的第二大脑。既然是第二大脑,就要担负起“秘书“的职责,当有重要事情临近的时候,它需要提前通知我并让我有充分的时间来应对。对此,我的需求很简单,一个简洁实用又不失美观的Notion倒计时计时器足矣。

阅读全文 »
请我喝杯咖啡吧