摘要：
精力管理就好比是计算机的内存清理，你以为关掉一些程序就行了，结果你还是卡成翔。 我的现状 雷猴啊，我是一个临期程序员。打过几年工，被好几个同事问过我为什么精力这么旺盛。 这两年我大多数情况都是早上8点前就到公司（原本9点上班，后来调成8点半，晚上要是加班就可以多赚半小时了），属于工贼类型。 晚上回到 阅读全文
posted @ 2023-10-27 22:56
德育处主任
阅读(16)
评论(0)
推荐(0)
摘要：
本文简介 本文介绍 Three.js 的基础方法：监听材质加载。 在 《Three.js 基础纹理贴图》 里介绍了如何给图形贴图，贴图前需要先把纹理加载好。我们基于这篇文章继续讲解如何监听材质加载成功或者失败。 监听单个材质 我们使用 TextureLoader 的 load() 方法加载纹理时，第 阅读全文
posted @ 2023-10-27 22:51
德育处主任
阅读(63)
评论(0)
推荐(0)
摘要：
本文简介 p5.js 作为一款艺术类的 canvas 库，对颜色方面的支持是挺下功夫的，比如本文要介绍的渐变方法。 lerpColor() 要实现渐变效果，可以使用 lerpColor() 方法。 lerpColor 的作用是混合两个颜色以找到一个介于它们之间的颜色。 语法是这样的： lerpCol 阅读全文
posted @ 2023-10-27 22:51
德育处主任
阅读(79)
评论(0)
推荐(0)
摘要：
本文简介 在刚接触 p5.js 时我以为这只是一个艺术方向的 canvas 库，没想到它还支持视频文件和视频流的播放。 本文简单讲讲如何使用 P5.js 播放视频。 播放视频文件 p5.js 除了可以使用 video 元素播放视频外，还支持使用 image 控件播放视频。 方式1：video元素播放 阅读全文
posted @ 2023-10-27 22:48
德育处主任
阅读(148)
评论(0)
推荐(0)
摘要：
本文简介 点赞 + 关注 + 收藏 = 学会了 本文介绍一个能让前端优雅下载大文件的工具：StreamSaver.js ⚡️ StreamSaver.js GitHub地址 ⚡️ 官方案例 StreamSaver.js 可用于实现在Web浏览器中直接将大文件流式传输到用户设备的功能。 传统的下载方式 阅读全文
posted @ 2023-10-27 22:44
德育处主任
阅读(393)
评论(0)
推荐(0)
摘要：
文章简介 之前在 《p5.js 光速入门》 里粗略讲过一下如何使用 p5.js 创建画布。 这次要介绍几个 p5.js 提供的画布相关的方法。 创建画布时的相关配置。 让画布绑定指定元素。 重置画布大小。 删除画布。 学习本文前你需要具备一点 p5.js 的知识，想了解的请查看 《p5.js 光速入 阅读全文
posted @ 2023-10-27 22:43
德育处主任
阅读(109)
评论(0)
推荐(0)
摘要：
本文简介 最近有工友问我前端怎么给图片做标注。使用 Fabric.js 或者 Konva.js 等库确实可以实现，但我又好奇有没有专门做图片标注的工具呢？ 在网上搜了一下发现 Annotorious 可以实现这个功能。Annotorious 提供了图片注释和标注功能，而且用法很简单。 本文分为 【快 阅读全文
posted @ 2023-10-27 22:43
德育处主任
阅读(144)
评论(0)
推荐(0)
摘要：
本文简介 点赞 + 关注 + 收藏 = 学会了 记得以前看爆笑校园里有一集讲到，一个人对着前面开了一枪，过了一阵子弹打中他自己的后脑勺。作者想通过这个冷笑话告诉大家一件事：地球是圆的。 在 Matter.js 世界里，默认是没有边界的，也就是说你往一个方向把物体丢出去，超过画布边界后你可能就找不回那 阅读全文
posted @ 2023-10-27 22:26
德育处主任
阅读(61)
评论(0)
推荐(0)
摘要：
本文简介 点赞 + 关注 + 收藏 = 学会了 在 《p5.js 光速入门》 里我们学过加载图片元素，学过过背景色的用法，但当时没提到背景图要怎么使用。 本文就把背景图这部分内容补充完整，并且会提到在 p5.js 里使用背景图的一些注意点。 背景图的用法 在 p5.js 里使用背景图只需做以下几步操 阅读全文
posted @ 2023-10-27 22:17
德育处主任
阅读(109)
评论(0)
推荐(0)
摘要：
本文简介 戴尬猴，我是德育处主任 本文介绍如何使用 OpenLayers.js （后面简称 ol）。ol 是一个开源 JavaScript 库，可用于在Web页面上创建交互式地图。 ol能帮助我们在浏览器轻松地使用地图功能，例如地图缩放、地图拖动、地图标记和地图交互等。 本文适合想有JS基础，又想了 阅读全文
posted @ 2023-10-27 22:04
德育处主任
阅读(1212)
评论(0)
推荐(1)
摘要：
本文简介 点赞 + 关注 + 收藏 = 学会了 如果你使用 Fabric.js 做编辑类的产品，有可能需要给用户配置字体。 这次就讲讲在 Fabric.js 中创建文本时怎么使用自定义字体、在项目运行时怎么修改字体、以及推荐一个精简字体库的工具。 学习本文前，你必须有一点 Fabric.js 的基础 阅读全文
posted @ 2023-10-27 17:28
德育处主任
阅读(330)
评论(0)
推荐(0)
摘要：
本文简介 点赞 + 关注 + 收藏 = 学会了 当你要复制一个 fabric 的元素时，你考虑到的是什么？是深拷贝当前选中对象再添加到画布中？ 其实，fabric.js 提供了一个克隆方法，在 fabric.js 官网的案例里也有这个demo：Fabric.js demos · Copy and P 阅读全文
posted @ 2023-10-27 17:06
德育处主任
阅读(91)
评论(0)
推荐(0)
摘要：
本文简介 带尬猴，我是德育处主任 canvas 绘图时会根据当前状态来绘制。很多的 canvas 库都利用到这一特性。比如 p5.js 利用了 canvas 状态特性衍生出 push 和 pop 函数实现状态隔离（既然提到了，下一篇就讲这个）。 有兴趣了解 p5.js 的工友推荐阅读 《p5.js光 阅读全文
posted @ 2023-10-27 17:02
德育处主任
阅读(31)
评论(0)
推荐(0)
摘要：
本文简介 带尬猴，我嗨德育处主任 不知道你有没有遇到过在使用 Fabric.js 时无意中一些骚操作修改了元素的样式，但刷新画布却没更新元素样式？ 如果你也遇到同样的问题的话，可以尝试使用本文的方法。 是否需要重新绘制 我先举个例子。 <canvas id="c" style="border: 1p 阅读全文
posted @ 2023-10-27 17:02
德育处主任
阅读(47)
评论(0)
推荐(0)
摘要：
本文简介 带尬猴，我嗨德育处主任 前面写了几篇 p5.js 文章 都还没涉及到3D图形，但其实 p5.js 是提供了基础的3D图形的。 本文就从最简单的立方体讲起，并做几个小demo和各位工友一起掌握立方体的用法。 立方体的基础用法 在 p5.js 里使用 box() 方法可以创建立方体。 基础语法 阅读全文
posted @ 2023-10-27 17:01
德育处主任
阅读(48)
评论(0)
推荐(0)
摘要：
本文简介 带尬猴，我是德育处主任 原生 canvas 提供了 save() 和 restore() 两个方法去管理画布状态。p5.js 作为一个 canvas 库，也理所当然的提供了状态管理的方法。在 p5.js 里这两个方法叫 push() 和 pop()。 本文主要讲解 p5.js 的 push 阅读全文
posted @ 2023-10-27 17:00
德育处主任
阅读(30)
评论(0)
推荐(0)
摘要：
本文简介 带尬猴，我嗨德育处主任 在 canvas 里，变换是基础功能。很多基于 canvas 封装的库都有这功能，比如 《Fabric.js 变换视窗》。 变换是针对画布进行全局调整的一种能力，它可以对画布进行全局移动、缩放、旋转等操作。 p5.js 同样具备变换功能，而且还封装了很多方便的函数去 阅读全文
posted @ 2023-10-27 16:59
德育处主任
阅读(52)
评论(0)
推荐(0)
摘要：
本文简介 带尬猴，我嗨德育处主任 p5.js 为开发者提供了很多有用的方法，这些方法实现起来可能不难，但却非常实用，能大大减少我们的开发时间。 本文将通过举例说明的方式来讲解 映射 map() 方法。 什么是映射 从 p5.js 文档 中可以看到对映射的说明 说明：从一个范围内映射一个数字去另一个范 阅读全文
posted @ 2023-10-27 16:59
德育处主任
阅读(25)
评论(0)
推荐(0)
摘要：
本文简介 带尬猴，我是德育处主任 当今的Web开发中，图形和动画已经成为了吸引用户注意力的重要手段之一。而 Pixi.js 作为一款高效、易用的2D渲染引擎，已经成为了许多开发者的首选（我吹的）。本文将为工友们介绍PixiJS的基础知识和使用方法，希望可以和工友们快速光速入门，掌握 Pixi.js 阅读全文
posted @ 2023-10-27 16:58
德育处主任
阅读(218)
评论(0)
推荐(0)
摘要：
本文简介 戴尬猴，我是德育处主任 欢迎来到《物理世界的互动之旅：Matter.js入门指南》。 本文将带您探索 Matter.js，一个强大而易于使用的 JavaScript 物理引擎库。 我将介绍 Matter.js 的基本概念，包括引擎、世界、物体和约束等。 本文还提供丰富的代码示例，帮助各位工 阅读全文
posted @ 2023-10-27 16:55
德育处主任
阅读(85)
评论(0)
推荐(0)
浙公网安备 33010602011771号