We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
本文为A-Frame简明教程系列的第一篇,更多文章请参见专题。
A-Frame是一个利用web技术创建虚拟现实的框架,由moz://a维护支持。
尽管名字起的有点不着调,但是,对于有着web编程背景的人来说,上手容易,而且虚拟现实也是未来的趋势,A-Frame的确是值得一学。 让我们一起来学习感受下。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>360° Image</title> <script src="//cdn.bootcss.com/aframe/0.7.1/aframe.min.js"></script> </head> <body> <a-scene> <a-sky src="//aframe.io/aframe/examples/boilerplate/panorama/puydesancy.jpg" rotation="0 -130 0"></a-sky> </a-scene> </body> </html>
跟其他的库一样,使用A-Frame最简单的方法是在head部分里引入JS库,可以使用本地加载的方式,也可以使用CDN的方式。
<script src="//cdn.bootcss.com/aframe/0.7.1/aframe.min.js"></script>
接着,我们就可以在网页里使用A-Frame为所欲为啦。 全景图片的案例里,我们其实只需要把全景图片放到天空里就行啦。
<a-scene> <a-sky src="//aframe.io/aframe/examples/boilerplate/panorama/puydesancy.jpg" rotation="0 -130 0"></a-sky> </a-scene>
<a-scene></a-scene>用来创建一个场景。 <a-sky></a-sky>用来创建天空。
<a-scene></a-scene>
<a-sky></a-sky>
稍微需要说句,webvr方面目前只有firefox、chrome支持的较为好点。 本篇文章就是带大家入个门,欲知后事如何,敬请期待本系列教程。
爱前端,乐分享。FedFun希望与您共同进步。 欢迎任何形式的转载,烦请注明装载,保留本段文字。 独立博客http://whqet.github.io 极客头条http://geek.csdn.net/user/publishlist/whqet CSDN博客http://blog.csdn.net/whqet/ 我的简书https://www.jianshu.com/u/c11d4318b3c7
The text was updated successfully, but these errors were encountered:
No branches or pull requests
A-Frame初体验
关于A-Frame
A-Frame是一个利用web技术创建虚拟现实的框架,由moz://a维护支持。
尽管名字起的有点不着调,但是,对于有着web编程背景的人来说,上手容易,而且虚拟现实也是未来的趋势,A-Frame的确是值得一学。
让我们一起来学习感受下。
简单案例-全景图片
案例解析
跟其他的库一样,使用A-Frame最简单的方法是在head部分里引入JS库,可以使用本地加载的方式,也可以使用CDN的方式。
接着,我们就可以在网页里使用A-Frame为所欲为啦。
全景图片的案例里,我们其实只需要把全景图片放到天空里就行啦。
<a-scene></a-scene>
用来创建一个场景。<a-sky></a-sky>
用来创建天空。学习资源
敬请期待
稍微需要说句,webvr方面目前只有firefox、chrome支持的较为好点。
本篇文章就是带大家入个门,欲知后事如何,敬请期待本系列教程。
声明
爱前端,乐分享。FedFun希望与您共同进步。
欢迎任何形式的转载,烦请注明装载,保留本段文字。
独立博客http://whqet.github.io
极客头条http://geek.csdn.net/user/publishlist/whqet
CSDN博客http://blog.csdn.net/whqet/
我的简书https://www.jianshu.com/u/c11d4318b3c7
The text was updated successfully, but these errors were encountered: