分类:vue

vue开发笔记

vue词云根据值显示不同大小的文字

vue词云根据值显示不同大小的文字
vue数据大屏项目开发中,需要实现词云效果,这里使用的是插件js-tag-cloud,但是这款插件不能根据数值显示不同大小的文字,所以只能进行二次修改了。 修改后的代码 class JsTagCloud { /* 构造函数 */ constructor(containe...

yekong 2个月前 (10-12) 喜欢

vue3项目中实现甘特图

vue3项目中实现甘特图
数据大屏项目开发中,客户要求其中一个模块要点击后弹窗展示项目进度,使用甘特图来实现,今天我们来实现使用vue3实现甘特图的效果。 插件 "dhtmlx-gantt": "^8.0.10", 实例代码 <template> ...

yekong 3个月前 (09-27) 喜欢

使用gsap给svg图标增加线条动画

使用gsap给svg图标增加线条动画
开发了很多数据大屏了,今天突发奇想有没有办法给这些项目中的图标增加一些动画效果呢?让这些图标活起来,接下来我们来实现效果。 动态效果 动画实现原理 动画实现的主要原理: SVG路径属性: stroke-dasharray:定义路径的虚线模式。 strokeDashoff...

yekong 3个月前 (09-26) 喜欢

vue开发的数据大屏项目如何禁止调试

vue开发的数据大屏项目如何禁止调试
数据大屏项目开发完成上线后,为了尽可能的保护我们的代码不被调试,我们可能会需要禁用浏览器的调试工具,今天我们来推荐一款插件: disable-devtool disable-devtool是一个开源的JavaScript库,通过禁用开发者工具来防止代码被篡改或查看。这个库提供了一...

yekong 3个月前 (09-26) 喜欢

vue项目通过图片获取geoJson数据(图片配准)

vue项目通过图片获取geoJson数据(图片配准)
最近有一个项目,客户要求根据经纬度将一些标注渲染在图片上,但是客户没有提供geoJson数据,如果没有geoJson那么就没办法将标注渲染到图片准确的位置上。为了能够准确的将标注渲染到坐标上,我们需要根据图片来想办法获取到geoJson数据。 因为这是一个小区域的坐标范围,并不是...

yekong 3个月前 (09-23) 喜欢

vue通过图片获取geoJson数据(轮廓勾勒)

vue通过图片获取geoJson数据(轮廓勾勒)
之前我们通过图片获取了图片的四角坐标 vue项目通过图片获取geoJson数据(图片配准),接下来我们通过四角坐标配置图片,然后勾勒数据。 我们通过四角坐标将图片渲染到地图上,这里我们使用的是地图不是高德地图而是leaflet,之所以不使用高德,是因为高德地图渲染图片的时候是通过...

yekong 3个月前 (09-23) 喜欢

hls流视频播放海康视频

hls流视频播放海康视频
数据可视化大屏项目开发中,需要播放监控,这里我们通过hls.js来播放我们的监控视频。 测试在线 我们在写代码前,先使用在线工具测试一下,看看我们收到的视频流地址是否可以播放,之前客户提供的视频一直不能播放,使用IINA可以播放,但是使用网页无法播放,通过在线播放器测试也不能播...

yekong 3个月前 (09-13) 喜欢

银行监控中心数据可视化 vue3 数据可视化大屏

银行监控中心数据可视化 vue3 数据可视化大屏
vue3 数据可视化大屏 银行监控中心数据可视化 id 180 开发环境 nodejs 16 开发环境 vue3+vite+js 分辨率 1920*1080 演示地址 vue3 数据可视化大屏 银行监控中心数据可视化 演示demo:vue3 数据可视化大屏 银行监控中心数据可视化...

yekong 4个月前 (09-07) 喜欢

vue项目巧用gui工具快速调试效果

vue项目巧用gui工具快速调试效果
数据可视化大屏项目开发中,ui设计师做了一个下面的效果,文字是下面的3d倾斜效果,因为这些文字是要根据实际情况实时变化的,我们需要通过代码来达到这种文字效果。通过css修改一点调效果的话,显然是太慢了。文字3d倾斜调试。 我们需要一个快速达到预期效果的功能,这里我们知道通过tr...

yekong 4个月前 (09-07) 喜欢

vue高德地图实现轨迹回放

vue高德地图实现轨迹回放
数据可视化大屏项目开发中,有一个需求是实现汽车的轨迹回放效果,今天我们实现这个功能 动态效果 功能介绍 主要包含以下功能: 车辆选择 地图展示 路线绘制 车辆动画 车辆信息展示 核心实现 1. 初始化地图 initMap() { if (this.map) { ...

yekong 4个月前 (09-03) 喜欢