【Dataview View】进度条分隔线

显示一个进度条,可以自定义文字、数值,颜色,并有几种预设(年进度,月进度,周进度,日进度)可供选择。用来显示进度或者作为内容分隔条都不错。

调用方法

创建一个 dataviewjs 代码块,并放入如下代码:

基础调用

第一个双引号内是此视图的路径(见下方安装方法)。后面给出一个 0~100 的值作为要显示的进度。

dv.view("Progress-Bar", { value: 12.34 })

如果使用预设,则:

dv.view("Progress-Bar", { type: "year" })

可选类型:

  • year:年进度
  • month:月进度
  • week: 周进度
  • day:日进度

特定时间

dv.view("Progress-Bar", { type: "year", value: "2024-10-31 08:18:07" })

选择了预设类型时,可以在 value 属性中指定一个时间(格式如上),表示这个时间点的年(月、周、日)进度。

其他选项

  • width:1100,表示进度条占据的总宽度,如果不希望进度条占据全部正文宽度可以修改此值,一般 6080 比较合适
  • text:进度条左侧显示的文字,比如 "Year progress"
  • precision:精度,进度显示几位小数,默认为 2
  • color进度条的颜色,默认为文字颜色(十分朴素)

视图代码

稻米鼠的 DataView 视图合集 > 进度条(Progress Bar)

©2022~2025 稻米鼠. Last build at 2025-03-14 00:00:16