Mchanges

这是我参与11月更文挑战的第6天，活动详情查看：2021最后一次更文挑战 Unity 小科普 老规矩，先介绍一下 Unity 的科普小知识： Unity是 实时3D互动内容...

大家好，我是前端西瓜哥。今天我们来实现图形编辑器的标尺功能。 标尺指的是画布上边和左边的两个有刻度的尺子，作用让用户知道他正在编辑的视口所在位置范围。 我们的需求是：间隔特...

🌈介绍 基于 vue3.x + CompositionAPI + typescript + vite 的可拖拽、缩放、旋转的组件 拖拽&区域拖拽 支持缩放 旋转 网格拖拽...

前言 接上一篇，通过插件实现了拖拽缩放等功能，但是也产生一些问题，这次针对这些问题，使用原生方法来进行优化和调整。...

今天领导给我一个任务，就是要求画布上面需要增加一个标尺，用来识别画布内元素的坐标，于是就开始我的搬砖之旅了。 开始想着挺简单的，不就是对画布进行刻度标记吗，写着写着发现有点...

前言 课件地址 https://github.com/buglas/threejs-lesson 课堂目标 理解three.js中材质的基本用法 可以基于实际需求按需选择合...

项目用用到其他部分的网页地址，用iframe 嵌入到我们的3D页面中，出现了这个错误。 查了一下是因为浏览器在读取本地缓存数据时候的出错。 解决方法： 我的解决方法是在 u...

前言 相信有很多的小伙伴在开发过程中进行绘制图片，或者截图等，今天我把使用的在做一个总结分享给大家，避免入坑。 安装html2canvas 引入html2canvas 在所...

我们都有过这样的需求：将tree扁平化，或者把扁平化的数组转换成一棵树。可能是在后端返回的数据处理，也可能是传给后端的数据处理（不会有人都交给后端处理吧，毕竟我是被打怕了）...

让物体从上到下消失的shader处理。使用 threejs material中的onBeforeCompile方法，在编译前修改shader。...

vue+threejs控制相机：跟随物体 vue+threejs控制相机：跟随物体 vue+threejs控制相机：跟随物体...

canvas保存成File canvas有两个方法 .toBlob() 和 .toDataURL() 可以使用。 canvas.toBlob() canvas 转换成 Fi...

问题： 3D场景中的物体都被拉伸？ 调整相机的宽高比例：调整相机的宽高比例，使其与canvas的宽高比例匹配。设置相机的aspect属性，将其设置为canvas的宽高比例。...

前言 因为群里粉丝一直要求我写一篇可视化入门指南，今天他来了。其实说起前端可视化，大家所能想到的就是各种图表，大屏。这种看着贼炫酷，而笔者呢工作也一直从事3D前端开发工作，...

threejs 第一人称视角，指针锁定控制器PointerLockControls的使用 官方Demo 官方的使用例子 three.js - pointerlock con...

threejs官方例子里面有几个第一人称的Demo three.js webgl - geometry - minecraft three.js - misc - octr...

GLSL 实现一个菲涅尔效果。效果图如下： 代码实现 实现逻辑 先说几个名词：单位向量、法线、点积。不清楚的可以先了解下这个名词。 思路： 计算当前摄像机位置的单位向量。 ...

参考资料 修正postprocessing导致的颜色空间问题 问题 在项目中使用 OutlinePass 时候，发现场景变暗。 问题点 linear颜色空间 和 sRGB颜...

动态组件 什么是动态组件 就是：让多个组件使用同一个挂载点，并动态切换，这就是动态组件。 在挂载点使用component标签，然后使用v-bind:is=”组件” 用法如下...

CSS盒模型 CSS盒模型（Box Model）是CSS中用于描述和布局元素的一种概念。它将每个HTML元素看作一个矩形的盒子，这个盒子由内容（content）、内边距（p...