这里会显示出您选择的修订版和当前版本之间的差别。
两侧同时换到之前的修订记录 前一修订版 后一修订版 | 前一修订版 | ||
1.bi与可视化saca.dataviz:5图册:5.19dataviz的灵魂功能 [2021/08/27 15:11] admin |
1.bi与可视化saca.dataviz:5图册:5.19dataviz的灵魂功能 [2021/08/30 16:38] (当前版本) admin |
||
---|---|---|---|
行 1: | 行 1: | ||
< | < | ||
- | #5.19dataviz的灵魂用法,o(^▽^)o | + | #5.19DataViz的灵魂功能 |
##1. 列表编辑字段拼接html标签 | ##1. 列表编辑字段拼接html标签 | ||
- | 列表的单元格是可以渲染html标签的,比如img标签,单元格中就会展示图片。以下两个超链接是示例用法: | + | 列表的单元格是个宝藏,数据中包含html标签会被渲染。以下两个超链接是示例用法: |
[使用列表制作指示同环比正负的上下箭头](http:// | [使用列表制作指示同环比正负的上下箭头](http:// | ||
[列表实现数据颜色判断](http:// | [列表实现数据颜色判断](http:// | ||
编辑字段中可以写复杂的逻辑,当然也可使用SQL数据集,提前写好相关的逻辑。 | 编辑字段中可以写复杂的逻辑,当然也可使用SQL数据集,提前写好相关的逻辑。 | ||
+ | 曾使用此方式解决如下问题: | ||
+ | 1. 筛选弹出页中的图片,使用group_concat()函数还可以横向拼接图片 | ||
+ | 2. 解决弹出页播放的视频内容 | ||
+ | 3. 单元格内实现富文本的效果,动态变换数据及文字样式 | ||
+ | 4. 动态拼接超链接地址 | ||
+ | |||
##2. 网页控件 | ##2. 网页控件 | ||
网页控件本身是一个iframe,用法灵活能解决很多问题。列举如下 | 网页控件本身是一个iframe,用法灵活能解决很多问题。列举如下 | ||
1. 网页控件实现过滤条件筛选图册 | 1. 网页控件实现过滤条件筛选图册 | ||
- | 理论基础 | + | 基础条件 |
[外部页面如何实现与图册内图表的联动交互](http:// | [外部页面如何实现与图册内图表的联动交互](http:// | ||
代码示例 | 代码示例 | ||
[图册内资源传参过滤](http:// | [图册内资源传参过滤](http:// | ||
2. 网页控件实现导航菜单 | 2. 网页控件实现导航菜单 | ||
+ | 3. 嵌入外部的时间、天气等控件 | ||
+ | 4. 嵌入用户自己实现的页面 | ||
+ | 5. 视频直播流 | ||
+ | 缺点: iframe有跨域的限制,非原生的下拉框会被自由块边界截断,iframe的性能与浏览器差一个数量级,不适合大规模使用。 | ||
##3. 图表左键自定义函数 | ##3. 图表左键自定义函数 | ||
- | 用户可以编写回调函数,使用js实现交互动作。 | + | 用户可以编写回调函数,使用js定义交互动作,这很自由。 |
1. [控制tab所绑定自由块的显隐](http:// | 1. [控制tab所绑定自由块的显隐](http:// | ||
2. 根据参数实现动态的跳转动作 | 2. 根据参数实现动态的跳转动作 | ||
- | dataviz可以配置的跳转目标是固定的,在这里可以实现多个目标页面的跳转。 | + | dataviz可以配置的跳转目标是固定的,在这里可以根据参数(维度值)判断实现多个目标页面的跳转 |
- | 3. 弹出自定义样式的提示框 | + | 3. 弹出自定义样式的提示框样式 |
+ | 4. 实现特殊的联动逻辑 | ||
+ | 5. 与某个rest接口做数据交互 | ||
+ | ... | ||
##4. 详细属性 | ##4. 详细属性 | ||
行 33: | 行 45: | ||
1. 替换切换的按钮 | 1. 替换切换的按钮 | ||
tab控件按钮样式单一,只有选中与未选中两种样式。现在可以指定任意的图片/ | tab控件按钮样式单一,只有选中与未选中两种样式。现在可以指定任意的图片/ | ||
- | 2. 使用图表切换自由块显隐 | + | 2. 使用图表切换自由块显隐 |
如前述“3. 图表左键自定义函数”,可以使用图表[控制tab所绑定自由块的显隐](http:// | 如前述“3. 图表左键自定义函数”,可以使用图表[控制tab所绑定自由块的显隐](http:// | ||
- | 3. 实现高亮标题与下方图表的同步轮播变换。 | + | 3. 实现局部内容的轮播,比如自定义的高亮标题与下方图表的同步轮播变换。 |
##6. url传参过滤 | ##6. url传参过滤 | ||
- | url传参过滤是与第三方系统集成页面的一个核心功能,也是解决产品过滤控件样式有限的有效方法。 | + | url传参过滤是与第三方系统集成页面的一个核心功能,也是扩展过滤控件样式及交互模式的有效方法。 |
1. 第三方系统可以使用iframe嵌套dataviz图册,通过编码动态拼接iframe的url实现更新过滤条件的目的,详见[地址传参过滤](http:// | 1. 第三方系统可以使用iframe嵌套dataviz图册,通过编码动态拼接iframe的url实现更新过滤条件的目的,详见[地址传参过滤](http:// | ||
##7. 富文本 | ##7. 富文本 | ||
- | 1. 合并多个kpi,减少kpi的前端请求个数,快捷编辑多个kpi的排版布局。 | + | 富文本的多种用途 |
- | 2. 用文字(用一堆空格做个悬浮层)配置超链接跳转,支持相对路径,支持当前页刷新、新打开页面或者弹出页面。 | + | 1. 合并多个kpi,减少kpi的前端请求个数,快捷编辑多个kpi的排版布局。 |
- | 3. 可嵌入图片,比如button图标,实现按键的跳转。 | + | 2. 用文字(用一堆空格做个悬浮层)配置超链接跳转,支持相对路径,支持当前页刷新、新打开页面或者弹出页面。 |
+ | 3. 可嵌入图片,比如button图标,实现按键的跳转。 | ||
缺点:对自适应不友好,嵌入的图片在导出项目后丢失。 | 缺点:对自适应不友好,嵌入的图片在导出项目后丢失。 | ||
</ | </ |