drogjh/data-view-web

data view/report screen（数据可视化大屏，数据报表设计器）

README

项目地址

GITHUB GITEE

Demo

Demo Create

数据可视化平台

前端

https://github.com/ggymm/data-view-web

https://gitee.com/1967988842/data-view-web

依赖项

"@ant-design-vue/pro-layout": "^1.0.8",
"ant-design-vue": "^1.7.5",
"axios": "^0.21.1",
"core-js": "^3.6.5",
"echarts": "^5.1.2",
"echarts-wordcloud": "^2.0.0",
"hotkeys-js": "^3.8.7",
"html2canvas": "^1.0.0-rc.7",
"jsoneditor": "^9.4.1",
"lodash": "^4.17.21",
"monaco-editor": "^0.25.2",
"store": "^2.0.12",
"uuid": "^8.3.2",
"vue": "^2.6.11",
"vue-echarts": "^6.0.0-rc.6",
"vue-router": "^3.2.0",
"vue-svg-component-runtime": "^1.0.1",
"vuescroll": "^4.17.3",
"vuex": "^3.4.0"

大屏设计器功能

1. 布局和自动缩放

2. 组件拖拽和旋转

3. 组件缩放

4. 拖拽参考线和吸附

5. 组件标尺

6. 组件组合拆分（未实现）

支持图表

1. 图表组件

    1. 散点图

    2. 折线图

    3. 折线面积图

    4. 柱状图

    5. 象形柱状图

    6. 地图

    7. 饼图

    8. 雷达图

    9. 漏斗图

2. 场景

    1. 预警点滴

3. 其他

    1. 轮播列表

    2. 数字翻牌器

    3. 标题文本

    4. 计数器

    5. 进度条

展示

1. 模板1

2. 模板2

3. 模板3

4. 模板4

5. 模板5

6. 模板6

实现参考

1. 配色参考

    jimureport

    easyv

2. 大屏实现

    1. 大屏布局和自动缩放

        1. visual-drag-demo

        2. datav-vue

        3. jimureport

        4. 百度Sugar

    2. 组件拖拽和旋转

        1. 布局和更新数据方式参考visual-drag-demo

        2. 实现参考datav-vue

    3. 组件缩放

        1. 算法参考visual-drag-demo

        2. 边框样式参考datav-vue

    4. 组件拖拽参考线和吸附

        1. visual-drag-demo

    5. 组件标尺

        1. datav-vue

    6. 组件组合，拆分

        1. visual-drag-demo

服务端

https://github.com/ggymm/data-view

https://gitee.com/1967988842/data-view

数据库

数据库表说明

数据库名称	表名	描述
data-view	data_source	数据源管理
	image	图片管理
	view_instance	数据可视化实例
	view_chart_item	可视化大屏项
data-view-template	*	示例图表数据