马赛克可视化

马赛克 可视化显示时间序列数据中的状态变化。当您想要显示基于字符串的状态随时间的变化时，此可视化类型非常有用。

从左上角的可视化下拉菜单中选择 马赛克 选项。

马赛克行为

马赛克可视化根据指定列中的字符串值显示彩色图块。每个唯一的字符串值都用不同的颜色表示。

马赛克控件

要查看 马赛克 控件，请单击可视化下拉菜单旁边的 自定义。

数据

• 填充列：选择要填充马赛克图块的列。
• X 轴列：选择要在 x 轴上显示的列。
• Y 轴列：选择要在 y 轴上显示的一个或多个列。
• 时间格式：选择时间格式。选项包括
  • YYYY-MM-DD HH:mm:ss ZZ
  • YYYY-MM-DD hh:mm:ss a ZZ
  • DD/MM/YYYY HH:mm:ss.sss
  • DD/MM/YYYY hh:mm:ss.sss a
  • MM/DD/YYYY HH:mm:ss.sss
  • MM/DD/YYYY hh:mm:ss.sss a
  • YYYY/MM/DD HH:mm:ss
  • YYYY/MM/DD hh:mm:ss a
  • HH:mm
  • hh:mm a
  • HH:mm:ss
  • hh:mm:ss a
  • HH:mm:ss ZZ
  • hh:mm:ss a ZZ
  • HH:mm:ss.sss
  • hh:mm:ss.sss a
  • MMMM D, YYYY HH:mm:ss
  • MMMM D, YYYY hh:mm:ss a
  • dddd, MMMM D, YYYY HH:mm:ss
  • dddd, MMMM D, YYYY hh:mm:ss a

选项

• 配色方案：选择用于图表的配色方案。

X 轴

• X 轴标签：输入 x 轴的标签。
• 生成 X 轴刻度线：选择生成 x 轴刻度线的方法
  • 自动：选择自动生成刻度线。
  • 自定义：要自定义 x 轴刻度线的数量，请选择此选项，然后输入以下内容
    • 刻度线总数：输入要显示的时间戳刻度线的总数。
    • 刻度线起始于：以 RFC3339 格式输入开始显示刻度线的时间。使用 日期选择器 字段自动为此字段生成 RFC3339 格式的时间戳。
    • 刻度线间隔：输入每个时间戳刻度线之间的毫秒数。

Y 轴

• Y 轴标签：输入 y 轴的标签。
• Y 轴标签分隔符：如果 y 轴上有多个列，请输入分隔标签的分隔符，例如逗号或空格。如果未指定分隔符，则标签是所有 y 列的连续字符串。
• 生成 Y 轴刻度线：选择生成 y 轴刻度线的方法
  • 自动：选择自动生成刻度线。
  • 自定义：要自定义 y 轴刻度线的数量，请选择此选项，然后输入以下内容
    • 刻度线总数：输入要显示的刻度线总数。
    • 刻度线起始于：输入刻度线的起始值。
    • 刻度线间隔：输入每个刻度线之间的间隔。

悬停图例

• 方向：选择悬停时显示的图例的方向
  • 水平：选择水平显示图例。
  • 垂直：选择垂直显示图例。
• 不透明度：使用滑块调整图例的不透明度。
• 行着色：选择以彩色显示图例行。

示例查询

以下查询使用 NOAA 水样本数据 来显示水位随时间的变化。在 可视化控件 中使用 level description 作为 填充列。

from(bucket: "noaa")
    |> range(start: v.timeRangeStart, stop: v.timeRangeStop)
    |> filter(fn: (r) => r._measurement == "h2o_feet")
    |> filter(fn: (r) => r._field == "level description")
    |> aggregateWindow(every: v.windowPeriod, fn: last, createEmpty: false)