Question

怎么样在网页中插入3D模型？

Answer 1

如何在网页里插入3D模型并进行互动展示？

其实官方已经给出了插入网页的方法但是没有具体步骤，而且软件自动生成的代码有问题，不能自适应屏幕大小。所以很多没有接触过网页设计的朋友一头雾水不会修改。

首先需要安装一个Dreamweaver软件用于修改网页代码

在模版之家下载了如下图所示的一个网站，我们的目标是把3D模型插入到红框的位置。

打开渲染完成后的文件把红框中的两个文件复制到网站根目录

用Dreamweaver打开文件中的index.html（就是网站的首页）并点击红框位置的实时视图菜单（好找到要修改的位置以及实时看到效果）

在实时视图中点击下目标框体即可自动定位至要修改的目标代码

这时候我们用下列代码来替换目标位置的代码，代码中红色的部分需要根据自己的命名修改



不知道为什么直接贴代码无法显示只能用图片代替了，需要代码可以去下面的示例下载 

修改完成后按下F12保存并预览，出现红框中的图案就表明成功了。

在图片范围内拖动鼠标即可进行互动展示了。

同样的方法修改掉另外两个位置后得到如下页面。

还可以通过手机查看也可以分享到微信朋友圈，只要支持HTML5的浏览器都能查看。。。

Answer 2

到老子云上传模型压缩处理后，可以直接生成嵌入代码，只要把这个代码放到自己网站中，就可以把3D模型展示出来。不用下载安装任何软件，简单方便。

Answer 3

把你的模型导出FBX，上传压缩到老子云平台，编辑发布后就可以展示了

Answer 4

如果要仔细回答的话，估计得需要很多篇论文来详细解说才行了。
按照制作路线简单说一下：
1、把3D模型准备好，需符合webgl上实时渲染规则（模型面数、材质模式、贴图规范、灯光及相机调整）
2、网页的UI设计稿到位
3、程序人员开始编写网页代码
4、网页开发完成提测
5、测试通过之后正式发布
以上就是大体的在网页上呈现实时渲染的3D模型（可360度旋转、缩放查看模型），是不是觉得有些脑袋大，需要3D美术、UI设计、程序开发、测试人员等通力配合才行，而且所耗时间也不少。
其实现在国内外已经有在线工具网站可以直接让3D美术快速完成一个模型在网页上的渲染呈现而且不需要UI和程序人员介入，免费使用的比如：sketchfab、Google poly、playcanvas、动动三维、腾讯磨坊等等

作者：地心引力
链接：https://www.zhihu.com/question/20177414/answer/562117285
来源：知乎
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。