自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(18)
  • 收藏
  • 关注

原创 前端通过Spirit图的方式现实,展示序列帧

什么是序列帧?为什么要播放序列帧,它可以做什么?序列帧是指将一系列连续的图像帧按照一定的顺序播放,从而产生连续动画效果的技术。每一帧都是一个静止的图像,但通过连续地播放这些图像,人眼会感知到动态的效果。在计算机图形和动画领域,序列帧常用于制作动画、游戏、电影等多媒体内容。通常情况下,序列帧的制作过程包括以下步骤:设计和绘制每一帧的图像内容:根据动画或场景的需求,设计并绘制出一系列静止的图像帧。编排图像帧的顺序:确定每一帧的播放顺序,以便按照一定的速率连续播放。

2024-04-12 17:09:49 526

原创 前端如何实现带有阻尼效果的模态框(或对话框)

在移动端中的交互中通常都是有动画效果的,例如打开一个模态框(或对话框),用户按住并向上或向下滑动以选择其中一个选项。在滑动过程中,用户会感受到阻尼效果(即滑动的速度会逐渐减慢),当滑动停止时,最接近停止位置的选项会被选中。

2024-02-21 17:50:48 216 1

原创 three.js实现VR看房自由

万字详解-three.js实现VR看房自由

2024-01-11 17:51:14 1197

原创 three.js通过自定义后期处理实现智慧城市扫光效果

three.js通过自定义后期处理实现智慧城市扫光效果

2024-01-09 16:22:20 983

原创 前端如何播放序列帧、动画,以VUE项目为例

注意序列帧需要按如下命名,方便index变量拼上根目录组成的路径找到对于的序列帧使用方法如下,很简单,先引入人,然后绑在元素即可。

2023-12-18 19:00:27 1629

原创 three.js项目如何制作方向指示器

这个还是很好理解,就是两维度的旋转alpha和beta,不熟悉球坐标的朋友,可以先了解一下球坐标,这个很关键,因为罗盘里面的旋转角度其实就是这个球坐标里面的alpha值(也有叫方位角的),不过在three.js叫theta和phi。首先罗盘的旋转角度其实就是相机绕某一个点或者自身吧,如果用的是three.js自带的轨道控制器的话,那就是绕着某一个点了,如果自在一些全景图的场景,那就是绕着自身的Y轴的旋转角度;在全景图的项目中,左上角通常显示的是一个指南针或方向标示,用来表示当前视图的朝向。

2023-12-14 13:21:25 256 1

原创 three.js通过自定义着色器实现智慧城市扫光效果

在three.js中通过自定义着色器ShaderMaterial实现智慧城市扫光效果

2023-12-06 17:44:37 558 1

原创 用babylon.js简单实现类似cesium的flyTo方法

cesium的flyTo比较复杂,它的相机运动的时候,会计算高度啥的,太低的时候会先升空然后在飞过去再下降,感觉相机的运动轨迹像是一条曲线;在设置参数方面上,除了最主要的目标点和运动时间,还可以设置相机的欧拉角,相机差值时候的差值函数,执行结束后的回调等等;我们这里就主要实现从当前点运到目标点就行了,运动轨迹为一条直线,可以说是一个乞丐版的flyTo, 要加上欧拉角的话只需要再添加一个动画,因为用的是BABYLON.AnimationGroup,可以实现多个动画。

2023-12-05 16:20:00 493

原创 babylon.js中如何在场景渲染时或者数据加载时现实加载中动画

在babylon.js中数据加载和渲染是异步执行的,这中间就会有等待的时间,那这时间内,如何实现我们的动画呢?我们如何知道模型加载了多少?什么时候结束?当模型比较大,渲染时间较长,我们怎么知道场景什么时候渲染完成了呢?下面我们就一起探索一下。

2023-12-05 15:57:52 217

原创 babylon.js实现玻璃的反射效果

在三维场景中模拟玻璃通常涉及使用PBR材质实现,需要考虑透明度、折射和反射效果等效果。我这个效果感觉有点夸张了,看着跟镜子一样,可以根据实际情况调整其参数,环境贴图可以用HDR或者dds格式的。网上很多免费的素材可以下载。

2023-11-29 15:40:25 99 1

原创 经纬度坐标如何转成three.js或者babylon.js中的三维坐标

经纬度在three.js或者babylon.js中的如何应用,三维坐标和经纬度的互转

2023-11-02 14:44:19 268 1

原创 babylon.js生成水体,以及水面的反射效果

远处的海平线与天空相交,仿佛消失在了无尽的远方,给人以无限遐想的空间感。海洋深处,神秘的海底世界隐藏着无数奇异的生物,五光十色的珊瑚和游动的鱼群在蔚蓝色的海水中构成了一幅美不胜收的画卷。无论是在深蓝的海洋还是平静的湖面,人们都能感受到大自然的神秘和壮美,这也让水成为了自然界中一种令人陶醉的元素。水是生活中非常常见的玩意,在游戏中常用于一些限定的场景中,例如吃鸡中的海岛外面就是水,因为外面用不到所以就不建模了,用水来代替加上一个隐形的墙就可以限制住玩家的位置从而造成一些不必要的bug。

2023-10-25 12:09:12 212 1

原创 three.js实现日照分析,根据当地(维度和时间)模拟太阳高度角和方位角的变化

three.js实现白天效果,根据当地(维度和时间)模拟太阳高度角和方位角的变化

2023-10-25 11:19:47 516 1

原创 在cesium通过自定义着色器实现动态电子围栏

在cesium通过自定义着色器实现动态电子围栏

2023-10-16 12:40:57 616 7

原创 用cesium的后期处理实现类似three.js中的spotLight效果

用cesium的后期处理实现类似three.js中的spotLight效果

2023-10-16 11:41:17 521

原创 在babylon.js中,通过键盘控制实现类似吃鸡中的汽车控制--以赛车为例

在babylon.js中,通过键盘控制实现类似吃鸡中的汽车控制--以赛车为例

2023-10-16 11:04:52 144 1

原创 three.js实现三维饼图

three.js实现 类似Echarts的3D饼图

2023-09-18 18:15:45 639 4

原创 在不同分辨率下,通过vue实现可拖拽弹窗

不同分辨率下用,JavaScript实现可拖拽弹窗

2023-09-15 09:39:47 378

空空如也

空空如也

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

TA关注的人

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