js
关注
分享
扫一扫
天边那朵云
这个作者很懒，什么都没留下…
展开
-
THREEJS----修复spotLight.toJSON()后 通过ObjectLoader加载target朝向问题
37220 Object.toJSON 添加判断 object是否有target属性 如果有 通过direction属性记录 target的位置38931行 添加根据direction(记录spotLight.target的位置) 修改spotLight.target的朝向...原创 2020-04-01 11:46:52 · 607 阅读 · 0 评论 -
js超大数字加法运算
function splitNum(num, segment = 8) { num = num.toLocaleString(); let res = []; while (num.length >= segment) { res.push(num.slice(-segment)) num = num.slice(0, num.length - segme...原创 2019-10-28 17:59:51 · 828 阅读 · 0 评论 -
js模板解析
function template(tpl, data, translation = true) { return tpl.replace(/{.*?}/g, function (str) { let res = data[str.replace(/[{}]/g, '')]; if (res !== undefined && translation) { re...原创 2019-10-25 11:21:39 · 580 阅读 · 0 评论 -
electron调用Flash
首先 按需要下载32位或者64位的pepflashplayer.dll将pepflashplayer.dll放到项目中然后在main.js中注册// Modules to control application life and create native browser windowconst {app, BrowserWindow} = require('electron'...原创 2019-10-15 18:19:18 · 1725 阅读 · 2 评论 -
js字符串可执行语句
一. let str = '(function(){console.log("test"); } () )'; let func = new Function(str); func();二. setTimeout(str);三. eval(str);...原创 2019-07-03 15:20:39 · 1963 阅读 · 0 评论 -
webgl
注： canvas全屏的时候不要用 canvas.style.width 和canvas.style.height 给100%， 图像会失真； 直接 canvas.width = window.innerWidth; canvas.height = window.innerHeight; 或者 canvas.width = document.docume...原创 2019-05-23 09:00:10 · 4735 阅读 · 0 评论 -
canvas绘制多边形
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title></title> <style> canvas { border: 1px solid red; } &l...原创 2019-05-15 17:15:12 · 1451 阅读 · 0 评论 -
js实现xlsx, xls转json
思路用前端页面提交数据 用node进行写入数据的过滤逻辑在index.html中完成 node只进行写入操作文件目录如下需要现在根目录下启动index.jsnode index.js默认端口号是8081前端页面显示如下<!DOCTYPE html><html lang="en"><head> <meta...原创 2019-03-27 08:57:35 · 2664 阅读 · 0 评论 -
js 判断任意对象是否相等
来自vue源码function isObject (obj) { return obj !== null && typeof obj === 'object'} function looseEqual (a, b) { if (a === b) { return true } var isObjectA = isObject(a); v...原创 2019-03-09 12:10:41 · 729 阅读 · 0 评论 -
前端面试题
实现如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"&am原创 2019-02-27 11:59:36 · 175 阅读 · 0 评论 -
自定义元素的创建及css选中
<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial原创 2019-01-29 14:54:32 · 313 阅读 · 1 评论 -
获取未设置宽高的父容器的宽高
如果父容器未设置宽高直接dom.style.width 或者 dom.style.height 是取不到值的这时可以通过 dom.clientWidth 和dom.clientHeight 取值(值不带单位)原创 2019-01-29 14:28:33 · 689 阅读 · 0 评论 -
js计算matrix 实现transform
<!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-05-23 14:59:28 · 4262 阅读 · 0 评论 -
url 重定向
假设 目录 public 下有 两个文件 index.html 和sw.js访问地址为 127.0.0.1：8080/index.html正常情况下后端收到 的path 为 “/index.html”现在修改html 在html里 注册Service Worker 导入sw.js重新访问 index.html html 加载完注册了sw.js 这个时候 后端收到的path ...原创 2019-06-19 10:04:24 · 277 阅读 · 0 评论 -
页面通信
主页面和子页面都导入 signal.js在主页面 通过 iframe 或者 open方法打开子页面在子页面加载完成后开始通信主页面 const signal = new Signal（）； signal.atob('from a')； 监听来自子页面的信息 signal.onmessage = function(msg){}子页面 const signal = new S...原创 2019-06-26 08:45:37 · 275 阅读 · 0 评论 -
将videojs 视频绘制到canvas上
文章转载自嘿嘿嘿https://blog.youkuaiyun.com/qq_37540004/article/details/90750529原理1.原理其实很简单，做过全景图的同学都知道，球模型+全景图片贴图。 全景视频/全景直播就是 球模型+全景视频素材 。2.至于播放器样式，可以自己用Js+Dom自定义，或者更改videojs（别的播放器插件也行）的样式 即便你是用原生video也是可...转载 2019-07-25 10:42:33 · 4777 阅读 · 0 评论 -
web实现rtsp和rtmp协议视频直播
在chrome41以下可以使用vlc控件实现 其他浏览器包括IE也能用 当然IE可以用它特有的ActiveX控件但是高版本的浏览器除IE外 vlc无效rtsp：高版本的chrome可以通过应用商店安装 VXG 播放器后 实现直播（安装时需要翻墙）不需要后台可直接实现延迟大概是2s具体使用方法https://www.videoexpertsgroup...原创 2018-09-27 18:06:23 · 6579 阅读 · 1 评论 -
Permission denied (publickey,gssapi-keyex,gssapi-with-mic,password).
有一次虚拟机地址更改过后链接老是被拒绝因为别的配置都没动过可以确定不是虚拟机的问题最终发现没指定登录用户 git remote add origin 192.168.1.247:gl.git默认Administrator用户登录了的，然鹅我的 gl 库是在git用户里地址改成下就行了 git remote add origin git@192.168.1.247:gl...原创 2019-08-19 17:15:05 · 858 阅读 · 0 评论 -
threejs深拷贝
this.deepClone = (object) =>{ let target = null; if(object.type === 'Mesh' || object.type === 'Sprite'){ target = new THREE.Mesh(object.geometry.clone(false), object.material.clon...原创 2019-08-29 13:21:58 · 1513 阅读 · 4 评论 -
threejs 动画转json和json转动画
将一个AnimationClip 对象直接通过JSON.stringify( )转换成json对象 后 再用json对象重建AnimationClip是重建不了的正确做法是 通过THREE.AnimationClip.toJSON( '动画剪辑对象' )生成 json对象;加载json 再使用 THREE.AnimationClip.parse ( JSON.parse ( json ...原创 2019-08-29 17:49:21 · 1446 阅读 · 0 评论 -
js+css创建折叠按钮
<!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-UA-Compat...原创 2019-09-06 10:57:22 · 649 阅读 · 0 评论 -
Vue生命周期
转载 2019-01-16 11:13:32 · 127 阅读 · 0 评论 -
Polymer2.0拖拽
<link rel="import" href="../../bower_components/polymer/polymer-element.html"><link rel="import" href="../../bower_components/iron-flex-layout/iron-flex-layout-classes.html"><dom原创 2018-10-08 09:34:42 · 262 阅读 · 1 评论 -
setTimeout和Proxy的执行顺序
setTimeout 在下次事件循环的开头执行Proxy 的then方法在本轮事件的 结尾执行原创 2018-10-12 10:06:56 · 309 阅读 · 0 评论 -
js冒泡和捕获
冒泡是事件向外传递， 捕获是事件向内传递；event.stopPropagation() 既可以阻止冒泡也可以阻止捕获阻止冒泡时 事件向 外 传递到添加有stopPropagation()的元素后终止向 外 传阻止捕获时 事件向 内 传递到添加有stopPropagation()的元素后终止向 内 传<div onclick="eventProxy()"> ...原创 2018-10-11 16:42:42 · 561 阅读 · 0 评论 -
js原生模仿Polymer2.0属性监测
/* 调用示例class Polymer extends Base { static get properties() { return { age: { type: Number, value: 18 }, test:...原创 2018-10-11 14:45:05 · 359 阅读 · 0 评论 -
js移动端运动事件处理
window.addEventListener("devicemotion", handleMotion, true);真正改变的是DeviceMotionEvent作为HandleMotion函数的参数传递的对象中提供的信息。motion事件包含四个属性：DeviceMotionEvent.accelerationDeviceMotionEvent.accelerationIncl...原创 2018-09-20 14:58:34 · 324 阅读 · 0 评论 -
js 移动段判断手机朝向
window.addEventListener("deviceorientation", handleOrientation, true);function handleOrientation(event) { var absolute = event.absolute; var alpha = event.alpha;//值表示设备围绕z轴的运动，以度为单位，值范围为0到360...原创 2018-09-20 14:55:31 · 1128 阅读 · 0 评论 -
js网络监测
navigator.connection.onchange = function changeHandler(e) { console.log(e.target.effectiveType, navigator.onLine) }可断网或者切换网络试下 低版本浏览器不支持原创 2018-09-20 14:31:13 · 333 阅读 · 0 评论 -
js实现文本转语音
<script> let msg = new SpeechSynthesisUtterance("你好"); console.log(msg) //msg.rate = 4 播放语速 //msg.pitch = 10 音调高低 //msg.text = "播放文本" //msg.volume = 0.5 播放音量 ...原创 2018-09-15 12:55:33 · 6234 阅读 · 12 评论 -
javascript 导出div为图片PNG，div转svg,svg转canvas
<!DOCTYPE html><html><body><h2>Input Div:</h2><div id="div"><p>Just have a <span style='color:white; text-shadow:0 0 2px blue;'>T转载 2018-09-20 10:23:44 · 2963 阅读 · 0 评论 -
js实现多页面数据同步
父页面<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, in原创 2018-09-30 09:40:32 · 3100 阅读 · 1 评论 -
js浅拷贝和深拷贝
浅拷贝复制的是 指针。指向同一块内存 ，这样浅拷贝 原始对象或者新对象的修改都是在同一内存区修改的，所以会同步变化。深拷贝相当于重新开辟一块内存，把原始对象的值复制后填入新的内存区，原始对象和新对象的更改是在不同内存区修改的，所以原始对象和新对象之间不会有 任何 影响。对象只如果只有一层进行深拷贝，结果是深拷贝，如果有嵌套层， 嵌套层属于浅拷贝arr2 = arr1.con...原创 2018-10-09 14:06:44 · 330 阅读 · 0 评论 -
canvas判定重叠区点击了谁
假设 arr=[graphical-1, graphical-2, graphical-3]; arr存储了3个多边型的路径图形显示顺序是3>2>1 3出现在顶层,1在最底层鼠标点击的时候 让arr倒序循环判断 e.offsetX,和e.offsetY是否在多边形中 第一次为true时的元素就是被点击到的for(let i = arr.length; i >0;...原创 2019-01-16 09:47:50 · 1329 阅读 · 0 评论 -
canvas标定选区
以下代码只有设置部分操作部分在polygon-operation<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title></title> <style> canvas {原创 2019-01-14 14:55:31 · 774 阅读 · 0 评论 -
Uncaught TypeError: Converting circular structure to JSON 对象转字符串报错
报错原因: 执行JSON.stringify(obj)时 检测到obj 对象有递归引用 (对象的属性值引用了自身)假设:a = { n: 1};b = {a};b.a = b;控制台输出 b 展开可以看到是个递归对象;这时执行 JSON.stringify(b); 就会报错;解决方法 需要解除对象的属性 对自身的 引用...原创 2019-01-07 13:24:33 · 16105 阅读 · 3 评论 -
requestAnimationFragment帧速控制
let animation = (timestamp, elapsed) => { if (elapsed > 1000 / 30) {//速度控制在每秒30帧以内 //TO DO SOMETHING elapsed = 0 } window.requestAnimationFrame( _time...原创 2019-01-11 16:15:11 · 1316 阅读 · 0 评论 -
js保持图像比例 X轴充满全屏
<div> <img></div> img.onload = function(){ let w = img.width, h = img.height; img.style.width = div.clientWidth + 'px'; img.style.height = h * div.clientWid...原创 2018-11-02 14:49:05 · 405 阅读 · 0 评论 -
js 对象和数组 快速转换
数组转对象 obj = Object.assign( {}, arr ) 或者 obj = { ...arr}对象转数组 arr1 = Object.keys( obj) arr2 = Object.values( obj ) arr3 = Object.entries( obj) 对象转map 需要先转成数组(格式：[ [key, value] ]， 二维数...原创 2018-10-10 16:04:10 · 4102 阅读 · 0 评论 -
JS继承
class A { constructor(...props) { let arr = Array.from( props.flat(2), p => p+p )//flat 将多维数组拉成一维数组 Object.assign(this, { arr});// 给A 添加arr属性 } } c...原创 2018-10-09 17:26:45 · 108 阅读 · 1 评论