更新时间:2024-11-04 GMT+08:00
分享

路由导航(示例)

路由导航(示例)是导航组件的一种,通过配置不同的路由页面,快速切换和定位到其它的页面中,给数据大屏提供更多的交互模式。

在大屏设计页面,从“全部组件 > 导航”中,拖拽“路由导航(示例)”组件至画布空白区域,如图1,路由视图的配置介绍,请参见路由视图

图1 路由导航(示例)
图2 边距样式说明

卡片

卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中基础元素(卡片标题、图表、卡片背景、卡片边框)和图表元素构成。

图3 卡片
  • 背景
    • 背景色:设置组件卡片的背景颜色。
    • 边框:组件卡片边框设置,支持无边框、全边框和角边框三种样式。设置为全边框和角边框时,支持设置组件外圈边框的线型、圆角等。
    • 样式:选择图片时,图片显示的样式,支持普通、居中、拉伸和平铺四种样式。
    • 选择图片:使用本地的图片作为组件背景,支持新增目录和子目录,便于对图片进行分类管理。推荐使用JPG、JPEG、PNG或GIF格式的图片,且每张图片不能超过50MB。
  • 特效:组件是否高亮显示,支持默认展示和跳转到页面时展示。
  • 边距:组件中图表距离整个组件四边(上、下、左、右,如图2)的距离,默认为0,即铺满整个组件。

配置

在配置中,设置组件的页签样式、导航页签和默认路由。

图4 配置
  • 页签样式统一配置
    • 页签方向:设置页签的显示方向,如水平方向、垂直方向。
    • 位置:设置页签的位置,支持默认和自定义两种方式。
    • 快捷设置:设置页签的显示位置,如居左、居右或居中。“位置”设置为“默认”时,才显示该配置。
    • 上间距(%):设置页签距离组件上边界的距离。“位置”设置为“自定义”时,才显示该配置。
    • 左间距(%):设置页签距离组件左边界的距离。“位置”设置为“自定义”时,才显示该配置。
  • 导航页签:在导航页签,可删除或新增路由,也可对路由进行如下设置。
    • 页签内容:设置当前路由页签的显示内容。
    • 页签路由:选择当前路由页签关联的页面,只能选择已发布的页面。
    • 默认文字:设置路由页签默认文字的字体、颜色和大小等。
    • 默认样式:设置路由的默认样式,支持设置为颜色和自定义。
    • 悬浮文字:设置鼠标悬浮在路由上时,页签内容的字体、大小和颜色等。
    • 悬浮样式:鼠标悬浮在路由上时,路由显示的样式,支持设置为颜色和自定义。

    • 点击文字:设置单击路由时,页签内容的字体、大小和颜色等。
    • 点击样式:设置单击路由时的样式,支持设置为颜色和自定义。

  • 默认路由:进入路由导航时,默认显示的页面。

交互

在交互中,配置路由导航(示例)与其他组件或页面之间的交互能力。更多交互介绍,请参见交互设置

相关文档