zdog实现三维立体动画,并应用到vue项目中去

本文介绍如何从Zdog官网下载3D模型原型代码,并将其整合进Vue项目中,实现3D模型的展示与交互。文章详细说明了代码的引入方式及合并过程。
1.进入zdog官方网站

在这里附上链接https://zzz.dog/

zdog官网界面

2.下载原型代码

在这里选择一个你自己感兴趣的3D立体模型,然后点进去

例子

然后就会出来原型代码,这里我们点击下载整个原型代码

模型下载

下载完成之后,代码结构如图所示

目录结构

3.将html项目改写为vue项目
  1. 首先在vue自带的全局html文件中引入zdog所需要的zdog文件(这里有个点需要注意,我们的js文件需要放在body下面,等到页面渲染完成后在渲染zdog模型,否则会出现模型加载不出来的情况),这里有两个js文件,一个是直接引入,另一个需要将js文件放在一个目录下,并且采用相对位置引入此js文件。

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值