自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

角角兔的博客

我角角兔只想过普通人的生活

  • 博客(65)
  • 收藏
  • 关注

原创 web端的shader Threejs飞线

目标之前想用粒子来实现一下飞线的效果,看到很多大佬的代码发现使用粒子会是一个不错的选择,因为粒子的渲染比较省性能,之前看到有人使用圆形的粒子 后来发现其实普通的正方形的粒子就可以...

2019-11-19 12:03:08 4385 17

翻译 使用Web Audio与three.js实现音乐可视化

简介HTML5可以不借助其他的插件仅仅通过浏览器实现非常酷炫的事情,而这篇文章就是关于借助three.js以及Web Audio接口来实现声音可视化的。Web Audio允许你在浏览器端操作音频,需要了解更多关于Web Audio的相关信息请移步至这 MDN Web Audio API。而关于THREE.JS,官网上说是一个让创建WebGL应用变得简单的javascript 3D库。这篇文章的...

2018-10-10 12:01:15 6385

原创 windows10删除桌面右键菜单

打开注册表win + R输入regedit路径 计算机\HKEY_CLASSES_ROOT\Directory\Backgroundshell为桌面右键菜单shellx为文件夹桌面右键菜单删掉自己想要删除的东西即可

2021-06-05 16:25:20 1104 1

原创 three.js 设置渲染帧数 FPS

本片文章用于限制渲染的帧数不超过某个速率不单单是three.js 任意的使用js渲染的帧率控制都通用主要思路在渲染动画的函数外放置一个定时器在开始渲染的时候计时器开始计时在渲染一帧之前判断当前渲染的这帧距离 上一帧所经过的时间如果时间小于(1/FPS) 单帧渲染时间 (例如60帧就是 1/60s)则跳过不进行渲染如果时间大于(1/FPS) 单帧渲染时间 则将判定的时间设置为(当前帧距离上一帧的时间 - 1/FPS) 用于下一帧的计算const clock = THREE.Clock

2021-01-10 13:44:54 4419 1

原创 vscode 移动到末尾并且换行快捷键

ctrl+enter

2020-07-14 10:12:01 4810 2

原创 js 奇怪的面试题出现了

题目A、B、C 是 3 个字符串。把 A 中包含的所有 B 都替换为 C,如果替换以后还有 B 就继续替换,直到 A 不包含 B 为止。请编写程序实现以上功能。不允许使用系统提供的字符串比较、查找和替换函数。以上程序是否总是能正常输出结果?如果不是,列出哪些情况下无法正常输出结果,尽可能详细和全面。完全不会这样的题目, 但是可以看出是个算法题, 不能查找字符串是很艰难的一部分解决方案字符串替换需要 用KMP或者BF算法js// KPM算法// 获取部分匹配值表fu

2020-06-16 01:01:50 630

原创 js随机颜色生成

function getRandomColor() { var letters = '0123456789ABCDEF'; var color = '#'; for (var i = 0; i < 6; i++) { color += letters[Math.floor(Math.random() * 16)]; } return color;}//返回字符...

2020-01-03 15:41:20 212

原创 three.js 设置背景透明 让渲染的内容在其他div上方

有时候需要让three.js渲染的内容放置在其他div所显示的内容的上方,这个时候就需要设置渲染器透明:结果是这样的:其实只要设置渲染器开启alpha通道就行了var renderer = new THREE.WebGLRenderer( { alpha: true } );但是要记得让清除的颜色的alpha为0renderer.setClearColor( 0x000000, 0)...

2019-11-22 11:50:42 1368

原创 如何在webpack项目中添加文件夹映射绝对路径

要求(针对的情况)在webpack项目中有很多的引入是需要加一个特定的前缀的那么怎么映射文件位置呢例如我需要把import { xxx } from "src/components/bar/slideBar.vue'改成更为简单的import { xxx } from "@bar/slideBar.vue'需要怎么做呢?解决办法webpack配置文件中加入module.exp...

2019-09-30 12:35:08 1558

原创 VScode注释与取消注释快捷键

// 注释Ctrl+K+C取消//注释Ctrl+K+U/* */ 多行注释Alt + Shift +A

2019-08-08 17:44:14 25779

原创 web端如何获取笔压 web端获取笔压的js库

web端为什么要获取笔压这是我一直以来的一个疑问,在web端可以获得笔压么,比如一个如果开发一个web端的画板,使用canvas制作,假如客户端所用的设备是一个手绘板,能够获取笔压的话肯定可以让其效果更好。事实上我在之前找了好久都没有找到过已经成熟的解决方案,直到一天我找到了pressure.js什么是pressure.js...

2019-08-04 22:34:30 2102

翻译 如何使用GitHub Desktop管理Gitlab库

不管是新手还是老手,Github Desktop都是在苹果系统和Windows系统上管理与创建项目的不错的方式,GitHub Desktop都能够让在GitHub上的工作流更为简单快捷。Github Desktop 是一个开源的可视化应用软件,使用TypeScript 和React开发。链接: https://www.techefeed.com/internet/get-started-git...

2019-07-09 20:00:24 17393

原创 【小东西】 字符串形式的加载条

加载条一般来说,加载条就是可以让用户看到目前的加载情况,最重要的是知道当前状态所需要加载的总量,以及目前加载的量。在网页加载的过程中,可以让某样东西在加载之后完成一个回调,使加载的总数+1。直到所有的东西都加载完毕(100%)这小段代码的目的输入0-1之间的数字(加载情况),并且输入所需要的加载条的最高字数,返回一个字符串形式的加载条let logProgress = (progress...

2019-05-12 23:09:03 330

原创 【nodejs】用户随机不重复抽奖码生成

要求抽奖活动,用户注册的有唯一的手机号,根据手机号生成一个唯一且对应的抽奖码实现随机码生成先不管随机码是否重复,写一个根据电话来生成10位随机字符串的函数...let crypto = require('crypto') //引用加密模块.../** 根据一个盐值加密生成随机的字符串* @function* @param {string} source 要转换的字符串*/...

2018-12-20 10:29:19 5101

原创 es6 对象合并 class类中的默认参数 对象默认属性

问题我想要创建一个类,生成的对象有默认属性,同时也可以通过传入参数的形式修改其默认属性。例如:我有一个person类 他有age 和 name两个属性 初始化的时候属性分别为18 和 towrabbit。但是创建新的person对象的时候,我可以重新定义对象的属性 比如 我可以只把age改了,改成22,或者 只改名字 改成’角角兔’。解决Object.assign(target, …s...

2018-12-19 17:41:09 4066

原创 [node.js] mysql datatime格式转换为YYYY-MM-DD hh:mm:ss 字符串形式

情况我有个mysql数据库表里面有个字段是datatime,在查看的时候是YYYY-MM-DD hh:mm:ss(比如2018-12-16 12:23:33)这样的格式,但是数据库经过node查询之后发送给前端的是一个data对象比如:2018-12-14T06:53:05.000Z但是我需要的是:2018-12-14 14:53:05这样的这个转换其实并不难,只需要在链接数据库的时候添...

2018-12-16 11:17:22 4875 2

原创 阿里云oss对象存储图片预处理

点子最近发现阿里云oss对象存储还有图片处理技术,只要图片链接附加一些参数信息,可以将处理之后的图片发送过来,相比起先发送再处理要有很多好处。优点不需要本地处理图片了发送的图片是处理过的比如假如是缩小版的话就能减少带宽使用图片可以加水印费用图片处理费用如下也就是说每个月处理的图片在10TB以下是免费的,大于10GB的部分按照0.025元/GB进行计算,计算的时候按照图片原有大...

2018-12-14 21:46:28 4487

原创 使用express中间件multer上传文件到阿里云oss

目标web端nodejs后端中转,将web端的文件上传至阿里云的oss需要用到的技术文件上传将上传的文件暂存并且转存到阿里云oss上要求文件大小,格式限制文件重新命名文件位置存储数据流程过滤成功文件过大/格式不符前端传输文件node端获取过滤文件大小与文件名转存到阿里云oss并记录存储的信息返回前端存储成功信息返回前端反馈信息...

2018-12-11 17:37:01 3105

原创 个人阶段总结与展望

这篇博客是凑篇数的,我不想失去持之以恒的勋章,但是一天更四篇原创真的是好难啊。个人发展总结相比起去年,今年在前端方面的进步可谓神速了。4月初,深入地了解学习了three.js 与webgl相关的内容6月初开始学习vue 能够理解vue的基本思想 ,可以使用引入vue.js的方式渲染普通的页面,配置webpack (这玩意是真的烦哦) vue组件化管理,结构化的生成某些原因必须要学数据库...

2018-11-30 22:20:26 433

原创 改装vue-element-admin

问题与需求公司需要重做一个erp系统,所以个人想根据已有的框架改一个,自己是前端,对于vue熟悉一些于是找了一个vue后台管理系统框架。最后选择了vue-element-admin选择原因vue-element-admin在github上有23kstar 超出了其他同类型的资源,而且功能已经较为齐全了,所以只要选择部分功能改装一下,加上接口,应该就可以使用了。遇到的问题这个是一个个人项...

2018-11-30 21:50:58 2771

原创 node.js 连接mysql 获取getpost的信息实现查询 以及插入

要做的准备工作1.先把express 和mysql依赖包安装好

2018-11-30 21:36:52 992

原创 【three.js】使用three做一个自己的彩红猫

一直彩红猫中毒,在学了一些three.js之后,更想做一个属于自己的彩虹猫了。最后的完成效果:彩红猫手机显示效果也还可以。目标在做一件事情之前 最为重要的就是列出要做到的事情目标,同时目标要记得是可测量的(得知道怎么样算是完成)彩红可调整猫使用帧动画进行动画效果彩红猫的速度是可以动态调整的(即帧动画速度可调整)彩红猫的贴图可以切换 切换不同风格的彩红猫循环向左的彩色背景,速...

2018-11-30 21:09:10 1297

原创 检测一个已经排序好的数组中任意两个元素的和是否存在等于某个值

检测一个已经排序好的数组中任意两个元素之和是否等于某个值题目的要求是检测一个已经按照从小到大的方式排序的数组中,检测任意两个数的和是否存在某个值,多个也可,只有一个存在就成立。例子这有一个数组:var arr = [1,2,3,4,5,6,7,8,9]现在需要检测该数组的任意两个元素中是否存在两个值相加等于5 如果存在直接返回true否则返回false自己想到的第一个方案: ...

2018-10-30 15:32:32 814

转载 欢迎使用CSDN-markdown编辑器记录

这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Ma...

2018-10-30 13:42:57 190

原创 我要1024勋章

别人发的1024怎么得都能得到勋章,为什么我没有 生气

2018-10-24 12:42:03 387 2

原创 python 获取字符串列表中的随机字符串

下面的方法将获取某个字符串列表中的随机字符串import randomdef randomText(textArr): length = len(textArr) if length &lt; 1: return '' if length == 1: return str(textArr[0]) randomNumber = random.randint(0,length-1...

2018-10-24 12:33:31 8405

原创 python qqbot 简易复读机

qqbot 简易小插件:具体的插件用法请访问qqbot github from datetime import datetimeimport timedef onQQMessage(bot,contact,member,content): if content == '-hello': bot.SendTo(contact,'你好我是机器人') elif content == '...

2018-10-22 14:48:17 3659 1

原创 vue <slot></slot> 插槽用于展现使用模板时候 内部的内容

起因在vue组件使用的过程中,出现在模板的内部的内容会被默认替换,比如下面的例子 &lt;div id="app4"&gt; &lt;temp1&gt;在模板使用的时候内部写的内容&lt;/temp1&gt; &lt;/div&gt; &lt;script&gt; Vue.component('temp1',{ data:...

2018-10-14 21:05:32 944

原创 javascript map函数的用法

map()函数根据一个回调函数创建一个新的函数,它会遍历数组中的每一个值例子 var arr1 = [1,3,5,6,8,19] const map1 = arr1.map(function(singleEl){ return singleEl*2; }) console.log(map1) //返回的map1函数数组为[1,6,10,12,16,38]回调函数可用的参数...

2018-10-14 08:15:07 13106 2

原创 【font-spider】网页中引用字体文件过大的解决办法,网页字体文件压缩

font-spider(字蛛)官网:字蛛github源码安装先要安装npm与node安装好之后就可以直接安装字蛛我用了centos的服务器 用npm全局安装font-spider# npm install font-spider -g安装之后输入# font-spider看到下面的就说明安装成功了使用方式首先要有项目中的html文件 在其外联的css样式中要规定字体文...

2018-09-27 10:46:11 5144 3

原创 three.js 屏幕截取变成图片 截图

截取three.js 渲染的图,如果直接将输出的canvas变成图片是无法获取的,因为在获取之前渲染界面是清空的状态,所以需要在渲染之后清空之前将渲染的内容转换为图片...

2018-09-19 12:37:39 5724 4

原创 关于逻辑时间与渲染时间的小点子 增量时间 逻辑与渲染

在看别人代码的时候看到这么一段:var delta;function loop(){ var now = new Date() - 0; var d = (now - delta)/(1000/60);//此处delta为上一帧的时间点 delta = now; update(d); render(); requestAnimationFram...

2018-09-09 08:34:23 692

原创 [pixi.js]刚学pixi.js做记录 创建应用 添加图片精灵

pixi.js是用于在canvas上绘制2d图像的库,他使用了webGL,可以使用硬件渲染,所以速度很快,可以达到很迅速的绘制效果。基本引入首先引入pixi.js 这个直接去官网找就行 pixi.js在页面中引入:&amp;lt;script src=&quot;../pixi.min.js&quot;&amp;gt;&amp;lt;/script&amp;gt;这玩意很大,文章版本4.5.5就要411kb。但是绝对物...

2018-09-06 17:36:17 4413

原创 node.js 处理ajax get和post信息

node.js 处理get请求要做的准备工作1.express依赖包 2.url模块 用于对url格式的字符串进行解析,返回一个对象。根据不同的url进行处理,返回不同的数据。创建js文件:getApi.js/*引用模块*/var express = require('express');var app = express();var url = require('url...

2018-08-14 16:05:28 4185 1

原创 csdn博客不能更新排名了

不知道为毛最近博客不更新排名了,我发现自己的博客有1个月都没更新排名,不禁想起他们的排名机制是不是变掉了,我记得以前是每天八点更新的 然后查看了csdn的论坛 也发现很多排名不更新的帖子: 很多帖子下面都有官方管理员的回复: 好吧只能等待更新了 欢迎评论点赞 ...

2018-08-11 15:36:39 1673 2

原创 【freecodecamp】更新仓库 Inventory Update

题目要求freecodecamp 上面的一个练习题 题目要求是: 依照一个存着新进货物的二维数组,更新存着现有库存(在 arr1 中)的二维数组. 如果货物已存在则更新数量 . 如果没有对应货物则把其加入到数组中,更新最新的数量. 返回当前的库存数组,且按货物名称的字母顺序排列.当你遇到困难的时候,记得查看错误提示、阅读文档、搜索、提问。问题分析1.更新的顺序要按照后面的数组来...

2018-08-11 15:02:10 295

原创 【three.js学习笔记】06 自定义几何体的创建 对象克隆

three.js可以生成几种已经设定好的几何体,比如锥体,球体,圆柱体等,three.js也提供了工具可以自己通过顶点来创建自定义的几何体创建自定义顶点var vertices = [ new THREE.Vector3(0,2,0), new THREE.Vector3(-1,0,0), new THREE.Vector3(0,0,1), new THRE...

2018-08-08 22:49:06 2729 2

原创 webstorm 移动到末尾并且换行快捷键

起因webstorm编译器经常用到,比如下面function(){ console.log(&amp;quot;fuck&amp;quot;);}我刚写完fuck光标在fuck后面,那么我要换行以前一直是先end 再enter,后来发现有个快捷键可以快速地直接移到第二行 就是:shift+enter哇 成功地从一行代码的中间直接换到第二行,完美!...

2018-08-07 08:34:58 5270 3

原创 将html内容转为canvas内容的实现方法 将html转为图片的方法 html2canvas.js的使用

介绍因为要做记录将html的内容转成canvas并且作为图片显示。 其实是因为要做一个H5页面,类似于小测试,最后的测试结果是以图片输出的(其实canvas也能直接长按保存)。在网上找到了一个js库可以把html的元素转为canvas,特此记录以免自己忘记了html转为canvas的库: html2canvas.js官网 意思就是 html to canvas (html 转 can...

2018-07-31 18:07:15 20248 2

原创 【freecodecamp】 简易计算器项目

freecodecamp上的项目习题,制作一个简易的计算器。因为有eval()这个函数。所以做起来非常简单eval():传入一个表达式字符串计算并且输出结果; 例如 console.log(eval("1+1"));//2按照freecodecamp中国站上面的例子改版 自己做了一个: html:&lt;div class="block640" id="...

2018-07-31 10:57:48 297

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除