![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端开发
文章平均质量分 87
Nora Taki
这个作者很懒,什么都没留下…
展开
-
AR.js | 图像跟踪,特征识别触发事件
文章目录图像跟踪(Image Tracking)图像跟踪(Image Tracking)AR.js中提供了图像跟踪(Image Tracking)、基于定位(Location Based)、基于标记(Marker Based) 三种模式。其中图像跟踪模式是通过设备摄像头,扫描图片、绘画、照片等内容,从而定位场景的模式。其中用到了 自然特征点跟踪(Nature Feature Tracking、NFT) 技术,...原创 2021-06-04 13:59:30 · 4911 阅读 · 11 评论 -
二十行代码实现的WebAR,让她能看见你的“心”
构建一个蜡烛组成的爱心AR,在女票生日的时候给她一份感动,既省钱又显得高大上????内容不多,照做就好,走起ε=ε=ε=( ̄▽ ̄)文章目录效果演示整体过程生成标记文件生成gltf模型文件撸二十行代码效果演示整体过程利用 AR.js Marker Training 生成标记文件通过 3ds Max 导出 gltf 模型文件基于 AR.js 的 AFRAME 模式,编写二十行代码完成效果展示生成标记文件生成gltf模型文件撸二十行代码※ 记得一定要使用https协议参考文献DS原创 2021-04-20 10:03:51 · 563 阅读 · 1 评论 -
Windows系统前后端分离&多端发布的调试解决方案(WSL2+Nginx+Docker)
文章目录概述环境配置概述之前的文章《基于windows系统前后端分离&多端发布的调试解决方案(WSL+Nginx反向代理+编辑器debug+内网穿透)》中描述了一种解决方案,不过当下 wsl2 已经发布,同时使用 Docker 进行工程部署的解决方案确实有很多好处,所以基于这两种技术提供一种解决方案,实现windows环境下,配置类生产环境的linux系统。通过调整nginx和docker的配置,切换开发和生产模式。手绘个结构图环境配置喜大普奔!Hyper-V 和 VMWare 终于可.原创 2021-04-14 09:47:15 · 460 阅读 · 0 评论 -
基于windows系统前后端分离&多端发布的调试解决方案(WSL+Nginx反向代理+编辑器debug+内网穿透)
今天是 怪物猎人崛起 的发售日,早点撸完回家砍龙????文章目录概述在Windows中配置开发环境在WSL中配置生产环境开发模式dev运行项目利用nginx的反向代理实现同源策略内网穿透助力冲破本机切换为prd生产模式概述前后端分离将一个应用拆分成了两个项目去完成,各自关注不同方向和功能的开发。在人力资源充沛的前提下,当然是做好系统设计后,分配给不同的项目组单独完成,然后再联调。而对于前端组可以利用 mock 来模拟后端的数据,已实现必要的功能。不过假如是资源相对匮乏的小项目,有可能只让一个全栈负原创 2021-03-26 16:38:15 · 647 阅读 · 0 评论 -
拼凑小功能,咔嚓H5成分享图片
ずっと何かを 、誰かをさがしている我一直都在寻找着什么,寻找着某个人そういう気持ちに捕り凭かれたのは、たぶん、あの日から可能从那一天开始,我就陷入到了这样的情绪中————————————————————《君の名は》文章目录效果演示代码分释DOM结构利用html2canvas将DOM转成base64图片利用animate.css模拟截屏动画整体代码效果演示代码分释DOM结构<div class="container"> <div class="title"&.原创 2021-03-17 09:58:14 · 140 阅读 · 0 评论 -
京城十六区,不规则路径Createjs完美绘制流程
参考文档:CreateJS | A suite of JavaScript libraries and tools designed for working with HTML5想要了解和下载更多关于 标准地图 的内容,欢迎访问中国地图出版集团官网和中国地图出版集团官方微博本文用到的地图数据来源于《2021年日历 每日人文地图》如有兴趣可自行购买文章目录???? 效果演示???? 前言概述???? 效果演示原祖国的首都,也都是绿水青山???????? 前言概述先前在博文 《无道理的区原创 2021-03-05 09:43:44 · 390 阅读 · 1 评论 -
无道理的区划边界,不规则矢量图形Createjs绘制流程初探
参考文档:Swiper中文网-轮播图幻灯片js插件,H5页面前端开发标准地图来源:自然资源部地图技术审查中心承办的标准地图服务《南美洲地图 1:1750万 4开》 审图号:GS(2020)4394号想要了解和下载更多关于 标准地图 的内容,欢迎访问中国地图出版集团官网和中国地图出版集团官方微博文章目录???? 效果演示???? 概述需求???? 数据获取???? 代码分释???? 完整代码???? 写在最后???? 效果演示玻利维亚区域再闪烁???????? 概述需求地图 是按照一定原创 2021-03-01 22:29:25 · 692 阅读 · 3 评论 -
H5视差滑屏,Swiper的Parallax属性
参考文档:Swiper中文网-轮播图幻灯片js插件,H5页面前端开发标准地图来源:自然资源部地图技术审查中心承办的标准地图服务想要了解和下载更多关于 标准地图 的内容,欢迎访问中国地图出版集团官网和中国地图出版集团官方微博文章目录效果演示代码分释完整代码效果演示滑动时,地图元素的位移和文字元素的位移偏差导致的视差效果横屏时显示蒙版,锁定显示(文字其实应该是,“请竖屏观看”????,懒得再录屏了)代码分释主要用的是 swiper.js 基本属性中的 parallax 项官网说明如下原创 2021-02-24 10:40:44 · 2056 阅读 · 0 评论 -
H5通用结构,初探Swiper.js & Animate.css
参考文档:Swiper中文网-轮播图幻灯片js插件,H5页面前端开发Animate.css | A cross-browser library of CSS animations.文章目录概述及效果演示概述及效果演示废话少说,先看结果![在这里插入图片描述](https://img-blog.csdnimg.cn/2021022013204294.gif)...原创 2021-02-20 16:00:59 · 298 阅读 · 5 评论 -
抖抖fps抖up,Stage和StageGL性能测试
StageGL更新公告 STAGEGL – A FASTER, BETTER, STRONGER WEBGL UPDATE TO EASELJS参考 CreateJs - EaselJs 文档文章目录概述形单影只的“抖”来5000个一块“抖”StageGL出场,平滑且安静的“抖”对比调整完整代码概述2017年4月,EaselJs发布更新,正式推出了StageGL。和Stage一样,StageGL也是加载显示列表的根级别容器,直接继承于Container。同时是 WebGL-optimized .原创 2021-02-18 16:55:19 · 343 阅读 · 4 评论 -
新春快乐,牛年大吉!
地图来源 百度地图开放平台 API文档※ 代码中使用的百度开放平台的 ak 来自百度MapV的demo想要了解和下载更多关于 标准地图 的内容,欢迎访问中国地图出版集团官网和中国地图出版集团官方微博文章目录效果展示代码分释全部代码效果展示代码分释整体思路利用百度地图的JavaScript API GL,设置底层地图层。封装Text.js,直接在地图层之上生成新的canvas,并使用createjs对其进行绘制和控制。0 百度地图api层let map = new BMapGL.M.原创 2021-02-12 20:34:08 · 217 阅读 · 2 评论 -
[问题记录]前端 - textarea赋值前后不等问题
问题描述:项目中在表单提交时,进行表单数据比较,从而记录更改的数据。但发现在未修改textarea值的情况下,比较结果为不相等。本文模拟了问题产生的原因,以及提供了一种解决方法。问题产生页面加载完成时会获取到服务器端返回的数据originJson,解析JSON后得到originDatas,页面代码如下:<!-- index.html --><textarea id="...原创 2020-03-31 18:08:33 · 400 阅读 · 0 评论 -
vue专题 - 基础补习
知识技能获取,感谢[网易云课堂 - 微专业 - 前端高级开发工程师]运营团队。原创 2019-07-02 09:52:23 · 102 阅读 · 0 评论 -
jQuery.lazyload源码分析
前言现在这个年代还在写jQuery,我承认有点跟不上时代。但为什么说jQuery过时呢?个人感觉这篇剖析的比较浅显易懂:《jQuery真的过时了!》。但其实jQuery和其相关的插件中还是有很多实用技巧的,本文对jQuery.lazyload-1.10.0.js的源码进行分析,了解jQuery的注册事件。源码废话不多说,直接源码<!-- index.html --><d...原创 2019-06-12 14:09:23 · 187 阅读 · 0 评论 -
prototype - Javascript原型链原理分析
基本概念由于理解角度的不同,不同的开发者,会对其有不同的定义和叫法。所以先明确本文中各种类型的称谓。注:为了便于理解,暂时不考虑ES6,不引入Class等概念。var Person = function(){};var per = new Person();构造函数:与类的概念类似,其本质是通过function创建的函数,但会通过new的方式生成其对应的对象。Person即为一个构造...原创 2019-06-05 14:33:11 · 159 阅读 · 0 评论 -
Underscore.template - 模板引擎源码分析
模板引擎概述模板引擎(这里特指用于Web开发的模板引擎)是为了使用户界面与业务数据(内容)分离而产生的,它可以生成特定格式的文档,用于网站的模板引擎就会生成一个标准的HTML文档。underscore模板引擎实现使用方式Underscore.js说明文档var compiled = _.template("hello: <%= name %>");compiled({nam...原创 2019-06-05 13:23:12 · 400 阅读 · 0 评论