一颗得道仙丹-优快云博客

原创 Vue 3 + Canvas 实战：多序列帧动画的高效实现方案

本文介绍了基于Vue3+TypeScript+Canvas的多序列帧动画实现方案。通过预加载图片资源解决动画卡顿问题，利用Canvas精准控制每个动画的位置和尺寸，实现高性能的多动画同时播放。文章详细解析了数据结构设计、图片预加载、Canvas渲染等核心流程，并提出了懒加载、错误处理、动态帧率等优化建议。该方案特别适用于地图监控等需要展示多个独立动态效果的场景，具有高灵活性、稳定性和扩展性优势。

2025-11-18 16:31:16 725

原创 Vue3 实现鼠标跟随圆形遮罩与视频重叠交互效果

在现代前端开发中，交互式多媒体展示能极大提升用户体验。本文将介绍如何基于 Vue3 + TypeScript 实现一个「鼠标跟随圆形遮罩」效果 —— 当鼠标移动时，圆形遮罩会跟随光标，当遮罩与页面中的静态图片重叠时，重叠区域会显示对应的视频，营造出动态交互的视觉体验。

2025-09-02 13:20:56 923

原创 Electron + Socket.io 实现跨设备实时文件传输模块实践

import { ipcRenderer } from 'electron' // Electron原生通信，用于读取配置、重启应用import { ElMessage, ElMessageBox } from 'element-plus' // UI提示组件import { networkInterfaces } from 'os' // Node.js获取网络接口import * as fs from 'fs' // Node.js文件操作。

2025-08-28 15:24:55 792

原创 Vue 弧形文本组件实现：从原理到实践（参考 arctext.js）

采用组合式 API，逻辑清晰，易于维护完整的 TypeScript 类型支持，提升开发体验响应式设计，适配各种场景可配置性强，支持多种弧形效果通过这个组件，我们不仅能实现炫酷的弧形文本效果，还能深入理解文本布局的数学原理 —— 三角函数在界面布局中的应用，往往能带来意想不到的视觉惊喜。如果你需要更复杂的效果（如 3D 弧形、动画过渡），可以基于此组件进一步扩展，核心的弧形计算逻辑是通用的。

2025-08-04 15:39:25 469

原创微信小程序中实现文本分段语音合成播放的代码解析

同时，通过audioContext.onEnded监听音频播放结束事件，当音频播放完毕，在回调函数中销毁audioContext释放资源，将currentIndex自增 1 指向下一个文本片段，并递归调用playNext函数，继续处理下一个文本片段的语音合成与播放。设置lang: "zh_CN"指定语音合成的语言为中文，tts: true开启文本转语音功能，content: segments[currentIndex].trim()将当前索引对应的文本片段去除首尾空格后作为合成语音的内容。

2025-06-28 13:56:26 651

原创 Three.js 实战：用 MediaRecorder 实现 3D 场景音视频合流录制（含完整代码解析）

转载：Three.js 实战：用 MediaRecorder 实现 3D 场景音视频合流录制（含完整代码解析） - 简书

2025-04-08 14:41:19 183

c1976135804的博客

原创 Vue 3 + Canvas 实战：多序列帧动画的高效实现方案

原创 Vue3 实现鼠标跟随圆形遮罩与视频重叠交互效果

原创 Electron + Socket.io 实现跨设备实时文件传输模块实践

原创 Vue 弧形文本组件实现：从原理到实践（参考 arctext.js）

原创微信小程序中实现文本分段语音合成播放的代码解析

原创 Three.js 实战：用 MediaRecorder 实现 3D 场景音视频合流录制（含完整代码解析）

空空如也

空空如也

原创 Vue 3 + Canvas 实战：多序列帧动画的高效实现方案

原创 Vue3 实现鼠标跟随圆形遮罩与视频重叠交互效果

原创 Electron + Socket.io 实现跨设备实时文件传输模块实践

原创 Vue 弧形文本组件实现：从原理到实践（参考 arctext.js）

原创 微信小程序中实现文本分段语音合成播放的代码解析

原创 Three.js 实战：用 MediaRecorder 实现 3D 场景音视频合流录制（含完整代码解析）

空空如也

空空如也

原创微信小程序中实现文本分段语音合成播放的代码解析