- 博客(20)
- 收藏
- 关注
RSS订阅
原创 js实现图片裁剪功能
写项目遇到了一个图片裁剪功能，网上搜了半天全是裁剪框，并不能达到实际意义的图片裁剪它的实现过程主要是 canvas 的 putImageData()方法w3c给它的官方定义是：putImageData() 方法将图像数据（从指定的 ImageData 对象）放回画布上。demo:<!doctype html><html lang="en">...
2019-11-28 18:10:22
11390
5
原创 js生成任意文件并下载
我们在项目中经常会遇到下载文件的需求，在网上找了各种解决方案，终于实现了这个功能。我们以json为例，贴出个demo供大家参考：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>json文件下载</title></head>...
2019-08-12 16:07:31
4514
原创 Three.js分享
说一下我的理解，说到 Threejs 就不得不提到 webGL，说到 webGL 就不得不提到 openGLOpenGL：用于渲染2D、3D矢量图形的跨语言、跨平台的应用程序编程接口（API）。这个接口由近350个不同的函数调用组成，用来绘制从简单的图形比特到复杂的三维景象。而另一种程序接口系统是仅用于Microsoft Windows上的Direct3D。OpenGL常用于CAD、ITK、虚拟现实、科学可视化程序和电子游戏开发。OpenGL_百度百科WebGL：WebGL 是以 O
2022-05-18 17:09:18
723
1
原创 el-tree节点过滤不显示下级问题
elementui的节点过滤默认是不显示下级的从网上找到了不显示下级的方法let parentNode = node.parent // 父级nodelet labels = [node.label] // 当前node的名字let level = 1 // 层级while (level < node.level) { labels = [...labels, parentNode.label] // 当前node名字，父级node的名字 parentNode = pa
2022-04-05 13:39:05
3699
2
原创 git 提交代码
从master分支拉代码：git pull origin master初始化git init链接到远程仓库git remote add origin https://xxxxxxxxgit pull origin master开发代码查看代码状态git status将代码添加到暂缓区git add .提交说明git commit -m "提交说明"提交到远程分支git push origin master新建远.
2021-10-14 15:43:31
91
原创 自定义el-table组件
目录需求table和table-column组件table组件：table-column组件：table.js用法：引入：不带行内编辑带行内编辑文档：Table AttributesTable EventsTable-column Attributes需求最近项目上遇到一个需求，设计要求将列表改成这样...
2021-10-14 14:24:13
1330
原创 Three.js
说到three.js，我们就不得不提到webGL，说到webGL，我们都知道它是用来实现三维效果的一套规范，既然它是一套规范，那它肯定和canvas一样，有源码有那么它的内核究竟是什么呢？为什么我们见到过的前端3D都是插件，怎么没见到过webGL的源码。...
2021-10-13 17:13:31
2231
转载 Three.js圆周运动(绕轴旋转)
在Three.js中一个模型围绕一个中心做圆周运动，比如地球绕太阳公转运动。以坐标原点为中心，绕着坐标系Y轴旋转var angle = 0;(function animation() { // 每次执行渲染函数redner时候，角度累加0.005 angle += 0.005; // 圆周运动网格模型x坐标计算 绕转半径6000 var x = 6000 * Math.sin(angle); // 圆周运动网格模型y坐标计算 绕转半径6000
2020-11-17 15:02:53
3163
原创 js查找数组中与目标值最相近的数值
var arr = [500, 400, 320, 200, 1, 10, 8, 100, 130, 120, 135, 140, 180, 190, 170, -1, -2, -4]; // 原有数组var targetNum = 125; // 目标数值/** * @method * @author gedesiwen * @param {array} arr 需要查找的数组 * @param {number} num 目标数值，查找的是与这个数值最接近的 * @return {num.
2020-09-21 14:43:15
4570
原创 ajax请求文件地址返回Buffer数据
var xhr = new XMLHttpRequest();xhr.open('GET', url);xhr.responseType = 'arraybuffer';xhr.onreadystatechange = function getPdfOnreadystatechange(e) { console.log("xhr.readyState:"+xhr.readyState+" xhr.status:"+xhr.status); if (xhr.readyState =.
2020-09-02 16:02:33
618
原创 Cookie和session、localStorage和sessionStorage之间的区别
cookie和session的工作原理：cookie的数据保存在客户端。有一个过期时间设置，如果设置了时间，浏览器关闭时数据保存在硬盘上，再打开浏览器数据仍然存在，直到时间到。如果没有设置时间，它的生命期随着浏览器关闭而关闭，cookie就会消失。session的数据保存在服务端。当客户端请求服务端创建一个session时，服务端会检索这个请求是否包含了session id。如果包...
2020-04-03 14:42:27
166
原创 css选择器介绍和权重解析
CSS 指层叠样式表 (Cascading Style Sheets)样式定义如何显示 HTML 元素样式通常存储在样式表中把样式添加到 HTML 4.0 中，是为了解决内容与表现分离的问题外部样式表可以极大提高工作效率外部样式表通常存储在 CSS 文件中多个样式定义可层叠为一个
2020-02-25 18:22:49
510
原创 css水平和垂直居中的几种实现方式
方法一，flex布局：#box { width: 600px; height: 500px; border: red solid 3px; display: flex; justify-content: center; align-items: center;}#content{ width:300px; height:20...
2020-02-21 16:18:46
169
原创 前端css实现左边div固定宽度100px，右边div自适应布局
html结构：<div id="container"> <div id="left"></div> <div id="right"></div></div>方法一：flex 布局#container{ width:100%; height:500px; display:...
2019-12-09 16:49:05
969
原创 前端使用threejs运行VTK模型文件
这里为大家提供demo版的项目，我们跑的是VTK文件，最重要的原因是同样的模型VTK是最小的，当然其它文件格式也有对应的插件。当然我们光以VTK来讲，跑VYK文件要用到的插件一共有下面四个。c插件下载链接：https://pan.baidu.com/s/1wGLnfD3sPNZ9m6_sHnv5gQ提取码：v08q复制这段内容后打开百度网盘手机App，操作更方便哦demo目...
2019-12-06 11:08:27
2697
18
原创 【前端】video标签实现本机摄像头拍照
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
2019-12-02 16:20:08
1940
原创 vue实现网络监控摄像头直播拍照功能
获取摄像机品牌的RTSP地址比如海康的是： rtsp://user:pwd@ip:port/MPEG-4/ch1/main/av_stream遗憾的是前端不支持rtsp，但支持rtmp，我们就要想办法将rtsp转为rtmp。网络摄像头想要在前端播放需要启动流媒体服务器推rtmp流。我这边是请后端开发利用ffmpeg+nginx 实现的，后端推流实现参考链接：https://www...
2019-11-27 17:24:11
4116
1
原创 前端css实现箭头效果
效果图：htm部分：<div class="arrow_box"> <div class="arrow"></div></div>css部分：.arrow_box{ width:100px; height:100px; border-radius: 10px; backgroun...
2019-09-06 16:49:37
1763
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人