首先,准备一张360度的全景图,放在images文件夹下。
写一个空的html文档:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>demo</title>
</head>
<body>
</body>
</html>
复制代码
在head中引入aframe.js:
<script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script>
复制代码
在body中加入:
<a-scene>
<a-sky src="../images/360.jpg"></a-sky>
</a-scene>
复制代码
全部代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>demo</title>
<script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script>
</head>
<body>
<a-scene>
<a-sky src="../images/360.jpg"></a-sky>
</a-scene>
</body>
</html>
复制代码
效果如下:
© 版权声明
文章版权归作者所有,未经允许请勿转载。
THE END