Stone教程：一行代码就可以把3D场景植入到普通网页中

Posted 2022-07-30 陈小峰_iefreer

踏得网的Stone工具可以帮助用户快速构建3D场景，场景可以在Stone工具内编辑、播放、保存和重新加载。

如果想把在Stone工具中制作的场景放到现有的网页中，也很简单，只需要2步。

Stone提供了一个运行时库tds_rt.js，（tds_rt全称为techbrood stone runtime) 

链接地址为：https://techbrood.com/stone/tds_rt.js，

第一步是把该js库加载到页面中：

<script src="https://techbrood.com/stone/tds_rt.js"></script>

第二步是在页面加载完成时，调用TDS_RT.init方法来完成3D场景应用程序的加载：

window.onload = (event) => 
            //init有2个参数，第一个参数是工程的url，第二个参数是容纳3d场景的页面元素的id
            TDS_RT.init('https://techbrood.com/stone/templates/earth-and-moon.tsp', 'stone_div');
;

这里的tsp文件是techbrood stone program应用程序文件，是在Stone工具里面点击菜单保存时自动生成的。

这里有一个在线参考用例：

https://wow.techbrood.com/fiddle/59704