数据大屏开发中，需要监听实时消息，消息是使用的，最新的项目中获取ws数据的方法：vue项目中请求WebSocket获取数据
公共方法
function getSocket(url, params, callback) {
let socket;
if (typeof (...
2年前 (2023-10-17)
喜欢
数据大屏开发中，需要实现一个步骤条的效果，但是步骤条的长度可能会很大超过了当前显示区域，所以我们需要一个可以鼠标横向拖动的效果。
动态拖动效果
开发环境
vue2 webpack js
使用插件
"@better-scroll/core": "^...
2年前 (2023-10-17)
喜欢
数据可视化大屏 项目中经常会遇到需要渲染echarts地图 的情况，为了方便不同地区的数据使用，将一些地图数据整理出来，供大家参考，今天为大家整理的是echarts武汉市地区地图geoJson数据。
效果截图
echarts武汉市地区地图geoJson数据
echarts武汉市...
2年前 (2023-10-17)
喜欢
数据大屏 项目中经常会遇到需要渲染echarts地图的情况，为了方便不同城市快速实现效果，将不同城市的echarts地图效果整理出来，供大家参考，今天为大家整理的是echarts武汉市新洲区geoJson地图渲染实例。地图基于geoJson数据绘制。
1 echarts 武汉市新...
2年前 (2023-10-17)
喜欢
可视化数据大屏 项目中经常需要渲染echarts地图，为了不同城市快速实现，将不同城市的echarts地图效果整理出来，今天为大家整理echarts武汉市黄陂区geoJson效果实例。地图基于geoJson数据绘制。
1 echarts 武汉市黄陂区geoJson地图定义颜色
...
2年前 (2023-10-16)
喜欢
vue3 数据可视化大屏弹窗组件 - 数据一张图
vue3 数据大屏 项目开发中，需要弹窗组件，这里我们整理弹窗组件，并通过gsap补间动画给弹窗添加入场动画以及离场动画。
效果截图
演示动画
组件代码
<div class="popWin" v-i...
2年前 (2023-10-15)
喜欢
可视化大屏 项目中经常需要渲染echarts地图，为了不同城市快速实现，将不同城市的echarts地图效果整理出来，今天为大家整理echarts武汉市江夏区geoJson地图渲染实例。地图基于geoJson数据绘制。
1 echarts 武汉市江夏区geoJson地图定义颜色
...
2年前 (2023-10-15)
喜欢
vue 数据大屏项目开发中，有时候会需要实现3d地图下钻效果，这里我们使用echarts-gl来实现3d地图。今天的3d地图是从中国->省->市三级下钻实例。除了使用echarts实现3d地图下钻，我们还可以使用threejs来实现下钻效果，threejs 3d地图实...
2年前 (2023-10-14)
喜欢
数据大屏项目在调试开发中可能会需要指定调试端口号，以便于不和其他项目的端口冲突。
这里我们找到vue.config.js文件
关键代码
这里我们指定8083为端口号
devServer: {
port: 8083// 设置端口为8083
},
完整实例代码
'use s...
2年前 (2023-10-14)
喜欢
vue3 数据可视化大屏边框 - 智慧运营管理系统
边框由标题 主体 背景图片 下展背景动画等组成。
效果截图
动画效果
动画处理
默认隐藏边框，然后使用gsap来加载一个自上而下展开的动画效果，动画效果完成后，再将边框主体渐显出来。可以父组件可以通过 :duration=&...
2年前 (2023-10-14)
喜欢
