xObserve

  1. 入门教程
  2. 时间选择和刷新

xObserve 中的时间设计很简洁: 当你选择一个时间范围,那该时间将被所有仪表盘所使用,也就是说时间选择在 xObserve 中是一个全局变量。

时间选择器

你可以在仪表盘的右上角找到时间选择器,有四种方式可以设置时间,其中最常用的就是快捷时间选择。

快速选择

快速选择设置的是一个相对时间:从过去某个时间点到当下。例如,当你选择了 过去 1 小时, 那就意味着你选择了 now-1hnow

因此当你刷新仪表盘时,获取的数据总是最新的 1 小时之内的数据。

quick-time

在上面图表中,有四处地方显示了我们选择了 过去一小时 的时间范围,你能找到全部吗?

自定义时间范围

custom-time-range

这里展示了另一种设置时间范围的方式,看图片的左半边, 你可以直接输入想要的时间范围。

在图片中,我们首先选择了 过去 1 小时,然后修改 自定义时间 中的 起始 字段,然后点击 应用时间范围 来让新的修改生效。

可以看到,当时间从 now-1h to now 修改为 now-30m to now 后,图表中的数据也发生了变化,这很好,也符合直觉。

选择日期

选择时间面板的 起始终止 字段旁,有两个日历图标, 点击它们可以直接选择一个日期范围。

修改 url

当选择时间范围后,URL 也会随之变化,尝试修改 url 中的 fromto 参数,然后重新访问该 URL, 看看时间会如何变化。

同步到 local storiage

当选择时间后,该时间将被同步到浏览器的 local storage 中,这样当你刷新页面时,时间范围还是你之前选择的时间。

刷新

有时我们希望仪表盘的数据能自动刷新,例如每隔 60 秒刷新一次。

在 xObserve 中,只需要在仪表盘右上角的 刷新 图标旁选择一个刷新间隔即可。

如果你只想刷新一次,可以直接点击 刷新 图标。

refresh-icon