# SimpleDataVisualization
数据可视化简易Demo
vuex state:
1. components 存放所有组件状态
2. activeElement 当前激活状态的组件
3. editorScreen 画布区域缩放状态
drag & resize 组件：
1. mousedown: 更新 activeElement, 使用activeElement来变更组件样式
2. on dragging & resizing: throttle(fn, 16) 节流更新 activeElement
3. drag & resize end: debounce(fn, 100) 防抖更新 components
guide lines 组件：
根据 activeElement 的状态来更新显示状态与样式
simple-data-visualization:“数据可视化大屏”设计与编辑器
需积分: 50 18 浏览量
2021-03-15
17:33:24
上传
评论
收藏 89KB ZIP 举报
simple-data-visualization-main.zip （38个子文件） 
simple-data-visualization-main 
.gitignore 2KB package.json 1KB package-lock.json 100KB src components editor-control-bar SimpleController.vue 1KB line-charts LineChart.vue 295B drag-cover DragGuideLines.vue 2KB DragResizeIndicator.vue 11KB DragCover.vue 381B slider-bar SliderBar.vue 4KB main.js 312B assets icon iconfont.js 38KB views editor components ComponentsCanvas.vue 2KB HanldersCanvas.vue 563B Editor.vue 2KB editor-style.scss 2KB login Login.vue 133B preview Preview.vue 137B home Home.vue 174B utils preset-components.js 2KB common-utils.js 754B App.vue 560B router index.js 599B store active-element.js 1KB editor-screen.js 655B index.js 301B components.js 1KB LICENSE 1KB public logo.ico 4KB vite.config.js 948B .browserslistrc 30B .eslintrc.js 546B README.md 519B script buildcdn.js 1KB
index.html 434B babel.config.js 350B .gitattributes 66B .editorconfig 160B yarn.lock 112KB
评论0