Foxtable(狐表)用户栏目专家坐堂 → [分享]原生Table与echarts可视化大屏展示的完美融合


  共有5988人关注过本帖树形打印复制链接

主题:[分享]原生Table与echarts可视化大屏展示的完美融合

帅哥哟,离线,有人找我吗?
michl
  1楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:幼狐 帖子:106 积分:1331 威望:0 精华:0 注册:2021/8/20 16:21:00
[分享]原生Table与echarts可视化大屏展示的完美融合  发帖心情 Post By:2023/1/18 15:36:00 [只看该作者]

在引用echarts做大屏展示时想要加个表格进去,起初也是准备引用网页,但是想想毕竟fox在数据表处理上本身就很强大,可以很轻松便捷的生成自己想要的任何表。如果放着现成的表不用,再繁琐的用其它工具去写就有点多此一举了。
只是原生table比较朴素,和大屏主题风格不够协调,但是借助灵活的table设置同样可以实现,而且在后面做数据图表的自动更新时也更方便。
下面做个简单的例子:

↓这是生成一个普通统计表的样子,如果要搭配大屏深色风格肯定不能直接放上去。

图片点击可在新窗口打开查看此主题相关图片如下:未命名1.png
图片点击可在新窗口打开查看

↓通过样式设置,表格颜色部分基本上就能够完成。这里不需要用drawcell处理。

图片点击可在新窗口打开查看此主题相关图片如下:未命名2.png
图片点击可在新窗口打开查看

↓大屏中表格通常是滚动展示的,需要固定可视行数,自适应屏幕大小也是必须的,通过sizechanged完成。

图片点击可在新窗口打开查看此主题相关图片如下:未命名3.gif
图片点击可在新窗口打开查看


↓最后再加上些简单的效果,比如数据标记,鼠标移入移出,自动滚动等,分别通过drawcell,mouseenter-leave,timertick完成。
(这里说明一下,开始准备用悬停事件,但是在测试时hovering均正常,退出hovering时只有前几行生效,不明所以)

图片点击可在新窗口打开查看此主题相关图片如下:未命名4.png
图片点击可在新窗口打开查看

↓装入大屏动态测试

图片点击可在新窗口打开查看此主题相关图片如下:test.gif
图片点击可在新窗口打开查看





[此贴子已经被作者于2023/1/18 15:37:30编辑过]

 回到顶部
帅哥哟,离线,有人找我吗?
漂泥
  2楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:童狐 帖子:264 积分:3688 威望:0 精华:0 注册:2011/10/23 11:01:00
好贴  发帖心情 Post By:2023/1/19 9:07:00 [只看该作者]

希望分享源代码

 回到顶部
帅哥哟,离线,有人找我吗?
chen37280600
  3楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:六尾狐 帖子:1279 积分:7953 威望:0 精华:4 注册:2017/12/31 14:53:00
  发帖心情 Post By:2023/1/19 10:37:00 [只看该作者]

不分享源代码,说了个寂寞啊

 回到顶部
帅哥哟,离线,有人找我吗?
chen37280600
  4楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:六尾狐 帖子:1279 积分:7953 威望:0 精华:4 注册:2017/12/31 14:53:00
  发帖心情 Post By:2023/1/19 10:38:00 [只看该作者]

要不了解下这个,不用学echarts头痛,无脑暴力
[炫酷大屏解决方案!] 狐表+微兔 BS零代码可视化拖拽设计大屏,像窗口设计那样简单,会点鼠标就行,不用学复杂echarts代码,工具免费,小白都能做炫酷大屏

 回到顶部
帅哥哟,离线,有人找我吗?
WAWSAywh
  5楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:幼狐 帖子:87 积分:900 威望:0 精华:0 注册:2013/11/1 23:57:00
  发帖心情 Post By:2023/2/8 16:07:00 [只看该作者]

 跪求大哥赏个思路图片点击可在新窗口打开查看

 回到顶部
帅哥哟,离线,有人找我吗?
michl
  6楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:幼狐 帖子:106 积分:1331 威望:0 精华:0 注册:2021/8/20 16:21:00
  发帖心情 Post By:2023/2/11 17:12:00 [只看该作者]

用到的方法事件写在上面了,代码较分散,多参考官方文档

 回到顶部
帅哥哟,离线,有人找我吗?
ycli368
  7楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:四尾狐 帖子:998 积分:10453 威望:0 精华:0 注册:2012/12/11 14:25:00
  发帖心情 Post By:2023/5/19 9:31:00 [只看该作者]

狐表+webbrowser吗,兼容问题较多吧

 回到顶部