- 博客(49)
- 收藏
- 关注
RSS订阅
原创 canvas刻画时间轴
给同事写的demo，顺带分享下 直接复制代码运行就行了。注释都写的很清楚啦建议：如写时间轴之类的操作 一切单位换算成毫秒拖动更新时间轴 其实就是更新初始时间<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> canvas { ..
2020-05-25 15:43:40
2520
2
原创 解决canvas画布污染的问题
画布污染一般出现在 图片域名与当前图片不对称产生的。很多项目图片走的是cdn域名，会和正常项目的域名有偏差 所以进行图片裁剪会出现画布污染解释完毕如果出现画布污染，把你的图片转化成 base64 然后放到 img标签里面 然后canvas截取img标签就好啦图片域名——》canvas转化base64 （转化注意图片像素要和img 对应上）——》把图片赋值给一个i...
2020-04-29 15:17:02
3940
3
原创 Vite+Scss热更新失败原因
不管是React 还是 vue 项目 都是这个问题。注意git提交 有时候改了大小写不会覆盖。如果正确那么尝试把路由都改成小写。这个问题主要是路由地址的问题。查看路由大小写是不是正确。
2023-06-14 18:04:43
330
原创 Uncaught TypeError: Cannot read properties of undefined (reading ‘replace‘)
这个报错有可能是语言设置的问题 设置默认浏览器语言是 中文（简体）就好了 中文（简体）默认排第一 同事发现的问题。
2023-02-09 16:25:19
7418
原创 JS杨辉三角
如题所示是杨辉三角的概念，，上代码 ：let num = 10let a = []for (let i=0;i<num;i++){ let b = [] if (i===0){ b= [1] a.push(b) }else{ for (let j= 0;j<=i;j++ ){ if (a[i-1] && a[i-1][j] && a[i-1][j-1]..
2022-01-05 14:31:07
557
原创 canvas 画空心圆 实心圆
总是忘~ 看别人的还不如自己写个var canvas=document.getElementById('myCanvas');var ctx=canvas.getContext('2d');ctx.beginPath();ctx.arc(70,18,15,0,Math.PI*2,true);ctx.closePath();// 空心圆ctx.strokeStyle="#FF0000";ctx.stroke();// 实心圆// ctx.fillStyle="#FF0000";
2021-05-24 15:46:16
996
原创 离开当前页面定时器setinterval会出现延时
就不放测试数据了，感兴趣可以自己写个小demo 把console日志时间打出来对比 当前页和不在当前页的 日志时间或者可以看看抖音的红包功能，ios 退出 再次进入的时候 当前时间和实际时间有误差。。。（按照原理安卓应该也一样）好了 说下解决方案：简单来说就是监听离开当前页面和进入当前页 离开时记录本机电脑时间，关掉定时器。再次进入获取本机电脑时间减去离开本机电脑的时间 = 离开当前页的时间 重新开启定时器这个方法做全局监听document.ad...
2021-05-24 14:43:22
614
原创 vue开发console调试
如果面对运营开发。。可以在home.vue 的 mouted里 加一个 window.vue = this 把vue挂载在window对象中。。后期如果有一些按钮的显示隐藏等等的问题 可以直接在console里面调试
2021-05-11 14:09:56
542
原创 前端播放h265编码的视频
有一个插件 libde265.js git地址https://github.com/strukturag/libde265.js找底层分析了下 这个demo的视频。。。是H265 但是色深是8 并不是4K 试了下h265 4K视频 结果一直卡在loading 暂时也没有解决方案。。感兴趣的大佬麻烦留个言给个解决方案呗 PS: 纯兴趣研究，各位大佬请不吝赐教...
2021-03-15 17:10:37
1644
原创 canvas无法清除上一次画的线 clearRect无效
亲 你一定是偷懒少加了beginPath()https://www.w3school.com.cn/tags/canvas_beginpath.asp在 moveTo起始点加上beginPath()
2021-03-12 18:51:06
1961
1
原创 mac远程控制腾讯云 Permission denied, please try again.
ssh -p 22 root@148.70.142.88ssh 命令 -p 端口号 服务器用户名 默认是root @ 腾讯云ip公网地址
2021-02-23 11:10:34
728
原创 鼠标点击空白区域，非当前弹窗内容，当前弹窗消失
一般UI插件都有这个功能，但是难免UI插件并不能符合需求。。。直接上代码监听全局鼠标松开事件".seek-time-window" 是最div弹窗最外部的盒子 代码的意思是 是否是在seek-time-window这个盒子上松开鼠标 如不是则让弹窗消失我记得当时还想到了其他比较繁琐的方法~ 也可以做到这种效果~ 各位观众老爷如果有类似的方案 麻烦留个评论呐...
2021-02-02 13:52:53
328
转载 git远程强制覆盖本地 / git本地强制覆盖远程
git远程覆盖本地。。master 标红是远程分支名 记得覆盖下 git fetch --all &&git reset --hard origin/master &&git pull git本地强制覆盖远程master 标红是远程分支名 记得覆盖下git push origin master --force......
2021-01-07 10:08:43
6207
1
原创 空格键自动触发上一次点击事件
卡了半天。。这个问题是因为一个统一的butoon组件造成。。其实就是butoom焦点可以看下这位博主所描述的。。。虽然我认为他最后方法不对 在create里面放refs指定dom节点根本接收不到。。。但是他描述的方案是对的。。总而言之就是 焦点问题。。每次点击重置下焦点就行 focus()https://blog.csdn.net/qq_40556950/article/details/102804379最后 一般来说空格键 最为一个专属的按钮快捷键 所以 每次点击设置...
2020-11-12 11:28:13
1032
原创 css三角形 对应的取透明度（记录贴随时取三角形）
border-top:10pxsolidgreen;border-bottom:10pxsolidred;border-left:10pxsolidblue;border-right:10pxsolidyellow;transparent
2020-08-12 09:38:15
145
原创 获取url后缀？的字段
/** * 获取token id url固定传（window.location.href , ?后面的前缀) */getVideoId(url: string, id: string) { let startIndex = url.lastIndexOf(id); let idAfterData = url.substring(startIndex, url.length); let endIndex; if (startIndex === -1){ // 判断有无id这个字段 .
2020-07-23 10:06:44
143
原创 循环减去自身
for (let i = 0; i < this.allAudioData.length; i++) { if (this.allAudioData[i].top === deleteOrbital.top) { this.allAudioData.splice(i, 1); i-- }}循环减去自身 每一次splice（i，1） 数组长度都减去1 对应的索引 也减去1...
2020-06-30 15:27:21
138
原创 前端性能监控
先上大佬地址https://www.jianshu.com/p/1355232d525alet performance = window.performance ||window.msPerformance ||window.webkitPerformance;if(performance) { console.log(performance); }这个就比较大头了 如果面对万级以上的用户 这个就需要仔细研究了。。。粗略看了下 除了监控性能 还可以作为监控前进 后退 进入页...
2020-06-19 10:54:51
118
原创 js十大排序 个人理解（个人总结，适合新手观看理解，不间断更新）
看这篇博客 非常详细https://www.cnblogs.com/AlbertP/p/10847627.html1 .冒泡排序function bubbleSort(arr) { let len = arr.length for (let i = 0; i < len; i++) { for (let j = 0; j < len; j++) { if (arr[j] > arr[j + 1]) { //相邻元素两两对比 ...
2020-06-11 15:30:00
139
原创 前端实现从视频中抽离出音频
首先声明：也不是原创，看同事做了这个需求，感觉很炸，就了解了下 发现csdn 并没有类似功能 所以发表一份总共两份 一份是插件，一份是插件运用插件名称audiobuffer-to-wav npm依赖npminstallaudiobuffer-to-wav--save这是插件function audioBufferToWav (buffer, opt) { opt = opt || {} var numChannels = buffer....
2020-06-11 09:38:36
1657
5
原创 vue父级元素改变data数据的同时，调用子集元素的方法，子集元素用了父级元素改变的数据，数据没变化
父级元素方法 time是父级的datatimeAdd(){ this.time++ console.log(this.time) this.$nextTick(()=>{ this.$refs.aaa.ppppp() })}子集元素方法 this.time是父级传的参数ppppp(){ console.log(this.time)}如果没有用$nextTick 那么 time 是 0的情况下， 在父级调用 timeAdd方法时 在父级元素里t...
2020-06-08 18:04:35
779
原创 前端播放m4a文件
<video controls="" src="http://m701.music.126.net/20200602173940/683df575389a9a17ab8c5e0e082234e3/jdyyaac/070c/035a/0352/0ffde3d84a406712849848c8a780e785.m4a" ></video>线上代码 直接video播放就行。。但是最好把播放器控制台暴露出来 如果不加 controls 就看不到操作按钮了。。准备去网易云音乐找..
2020-06-02 17:39:17
2488
原创 js 获取一个数组里出现2次以上的数据， 获取只出现2次的数据，两个数组获取出现相同值，或者获取只出现2次的值
看到一个面试题 顺手写个demo循环遍历嘛对比一个数组就对比一个数组的2个数组就对比两个数组的，<script> /** * 获取数组里出现2次以上的数据 */ let a = [1, 1, 1, 2, 3, 4, 5, 6, 7, 2, 4, 6, 7, 7, 8, 1] let b = [] for (let i = 0; i < a.length; i++) { let v = a[i] let p = 0 ..
2020-05-25 16:57:02
1153
原创 控制鼠标移入图片放大缓动的效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style> div { width: 592px; height: 333px; overflow: hidden; } img { .
2020-05-18 11:17:38
166
原创 js 获取最大公约数
gcd(a, b) { if (b == 0) { return a } let r = a % b console.log(r) return this.gcd(b, r)},
2020-05-08 15:47:15
862
原创 图片网络地址 转化base64
getBase64Image(img) { let canvas = document.getElementById('myCanvas') let ctx = canvas.getContext('2d') ctx.drawImage(img, 0, 0, 592, 333) let ext = img.src.substring(img.src.lastInd...
2020-04-29 15:26:17
2172
原创 EventSource 监听后端发送的数据
let eventSource = new EventSource("http.110/110/getMsg") // 就和new Object 一样 new一个对象 里面的参数就是和后台对接的接口地址。。前缀可以放在main.js里面 let eventSource = new EventSource("/getMsg")基本就这个难点了吧 上代码...
2020-04-27 14:05:36
844
转载 js 点击按钮进行下载
1 download(src, fileName) { let x = new XMLHttpRequest() x.open('GET', src, true) x.responseType = 'blob' x.onload = function (e) { let url = window.URL.createObjectURL(x.res...
2020-04-27 11:21:42
998
原创 canvas 截图 drawImage出现误差。但是官网是对着的，因为官网展示的img标签就是图片源像素大小
首先 严重声明，不要头铁 珍爱秀发自己写截图功能，网上一堆插件呢。例如 html2Canvas 等等 前端截图 可以用css标签clip截图推荐插件https://github.com/dailc/image-process/blob/master/src/clip/README.md正文：同样一张图片，同样img标签和canvas标签一样大小，都是59...
2020-04-22 17:32:15
1569
空空如也
前端启动Hue本地服务
2023-08-12
TA创建的收藏夹 TA关注的收藏夹
TA关注的人