- 博客(15)
- 资源 (2)
- 收藏
- 关注
原创 vue3 vue-router嵌套两级路由时,每一级路由都使用transition+keep-alive时,二级路由之间切换离场动效正常,一级路由之间切换会导致离场的页面组件离场动效重复1遍
vue3 vue-router嵌套两级路由时,每一级路由都使用transition+keep-alive时,二级路由之间切换离场动效正常,一级路由之间切换会导致离场的页面组件离场动效重复1遍
2022-12-01 17:39:39
1545
原创 Vue实现图形化积木式编程(九)
将3d界面放入可拖动窗口中路由下一篇历史回顾前言最终实现效果本文实现效果完整代码代码分解0.项目初始化1.Blockly基本场景搭建2.工具栏工具列表转化为JSON格式3.生成代码4.执行代码后续计划Blockly开源项目GitHub链接资源下载链接你的点赞是我继续编写的动力路由下一篇未完待续…历史回顾Vue实现图形化积木式编程(一) ---- Babylon.js基础场景搭建Vue实现图形化积木式编程(二) ---- Babylon.js加载模型到场景中Vue实现图形化积木式编程(三)
2021-10-10 16:59:35
959
原创 Vue实现图形化积木式编程(八)
将3d界面放入可拖动窗口中路由下一篇历史回顾前言最终实现效果本文实现效果完整代码代码分解0.vue-directive-window库安装与引入1.vue-directive-window使用2.加入顶栏,设置可移动窗口的开启与关闭3.细节优化,解决加载窗口定位问题后续计划Blockly开源项目GitHub链接资源下载链接你的点赞是我继续编写的动力路由下一篇未完待续…历史回顾Vue实现图形化积木式编程(一) ---- Babylon.js基础场景搭建Vue实现图形化积木式编程(二) ---
2021-09-26 00:08:53
529
原创 Vue实现图形化积木式编程(七)
babylonjs-gui 按钮实现路由下一篇历史回顾前言最终实现效果本文实现效果完整代码代码分解0.babylonjs-gui库安装与引入1.按钮初始化2.按钮细节优化后续计划Babylon.jsBlockly开源项目GitHub链接资源下载链接你的点赞是我继续编写的动力路由下一篇未完待续…历史回顾Vue实现图形化积木式编程(一) ---- Babylon.js基础场景搭建Vue实现图形化积木式编程(二) ---- Babylon.js加载模型到场景中Vue实现图形化积木式编程(三)
2021-09-21 23:02:39
558
原创 Vue实现图形化积木式编程(六)
Babylon.js相机控制与相机动画前言最终实现效果本文实现效果完整代码代码分解0.弧度旋转相机(Arc Rotate Camera)1.相机控制2.相机动画后续计划Babylon.jsBlockly开源项目GitHub链接资源下载链接你的点赞是我继续编写的动力前言前段时间想要做一个web端的图形化积木式编程(类似少儿编程)的案例,网上冲浪了一圈又一圈,终于技术选型好,然后代码一顿敲,终于出来了一个雏形。TIPS:该案例设计主要参考iRobot Coding,只用做学习用途,侵删。https:/
2021-09-12 11:55:42
632
原创 Vue实现图形化积木式编程(五)
Babylon.js自定义启动界面前言最终实现效果本文实现效果完整代码代码分解1.自定义启动页面2.移除启动页面后续计划Babylon.jsBlockly开源项目GitHub链接资源下载链接你的点赞是我继续编写的动力前言前段时间想要做一个web端的图形化积木式编程(类似少儿编程)的案例,网上冲浪了一圈又一圈,终于技术选型好,然后代码一顿敲,终于出来了一个雏形。TIPS:该案例设计主要参考iRobot Coding,只用做学习用途,侵删。https://code.irobot.com/#/最终实
2021-09-04 17:39:37
467
原创 Vue实现图形化积木式编程(四)
Babylon.js实现碰撞效果前言最终实现效果本文实现效果完整代码代码分解0.NPM安装Ammo.js物理引擎依赖1.初始化物理引擎2.地面和小车加入碰撞体3.引入方块碰撞体后续计划Babylon.jsBlockly开源项目GitHub链接你的点赞是我继续编写的动力前言前段时间想要做一个web端的图形化积木式编程(类似少儿编程)的案例,网上冲浪了一圈又一圈,终于技术选型好,然后代码一顿敲,终于出来了一个雏形。TIPS:该案例设计主要参考iRobot Coding,只用做学习用途,侵删。https
2021-08-29 17:48:39
642
原创 Vue实现图形化积木式编程(三)
Babylon.js点击拖拽移动模型前言最终实现效果本文实现效果完整代码代码分解0.公用属性和函数1.点击落下处理2.点击移动过程处理3.点击松开处理4.绑定鼠标监听事件后续计划Babylon.jsBlockly目前正在整理源码,后续会开源整个系统你的点赞是我继续编写的动力前言前段时间想要做一个web端的模块化编程(类似少儿编程)的案例,网上冲浪了一圈又一圈,终于技术选型好,然后代码一顿敲,终于出来了一个雏形。TIPS:该案例设计主要参考iRobot Coding,只用做学习用途,侵删。https
2021-08-23 18:06:08
764
原创 Vue实现图形化积木式编程(二)
Babylon.js加载模型到场景中前言最终实现效果本文实现效果完整代码操作分解(Babylon.js模型格式转换与导入)0.在开源模型网上下载一个模型/自己制作一个1.转换为.babylon文件2.将模型文件放在服务器上方案一(最新发现的方案)方案二方案三3.加载模型3-1.async同步形式(obj模型结构)3-2.回调的形式(obj模型结构)3-3.async同步形式(glb模型结构)3-4.回调的形式(glb模型结构)问题:导入模型后一片黑4.(额外)启用调试窗口后续计划Babylon.jsBloc
2021-08-23 17:56:11
1317
原创 Vue实现图形化积木式编程(一)
Babylon.js基础场景搭建前言最终实现效果本文实现效果技术选型1.前端2.后端完整代码代码分解0.npm安装相关依赖1.引入模块2.场景初始化3.ArcRotateCamera 相机初始化4.灯光初始化5.地面初始化5-1. 绿地5-2.网格地面6.正方体物体初始化7.天空盒初始化后续计划Babylon.jsBlockly你的点赞是我继续编写的动力前言前段时间想要做一个web端的模块化编程(类似少儿编程)的案例,网上冲浪了一圈又一圈,终于技术选型好,然后代码一顿敲,终于出来了一个雏形。TIPS:
2021-08-23 17:32:01
2889
1
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人