Shy*_*sad 11 html api virtual-reality
这是我的index.html文件
<html>
<head>
<title>VR Sample</title>
<script src="//storage.googleapis.com/vrview/2.0/build/vrview.min.js"></script>
</head>
<body>
<div id="vrview">
<iframe width="100%"
height="300px"
allowfullscreen
frameborder="0"
src="http://storage.googleapis.com/vrview/index.html?image=ffff.jpg&is_stereo=true">
</iframe>
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
这是网站文件夹的结构
我尝试按照谷歌代码中的说明在Webserver中托管它.但是我点击了127.0.0.1.8887网址,我得到了一个没有文件或文件夹的空白页面.然后我尝试在XAMPP上托管它,它确实有效.但是,我没有得到panaroma图像.相反,我得到了这个错误
我用谷歌相机应用程序拍摄360度图像并使用谷歌的在线转换器将其转换为立体声,但得到了相同的错误.我也尝试从github下载VRView repo并将代码修改为
src="vrview/index.html?image=ffff.jpg&is_stereo=true"
Run Code Online (Sandbox Code Playgroud)
那也没有用.
您正在使用 vrview 的 iframe 版本,这意味着当您请求“ffff.jpg”时,您实际上是在请求:
http://storage.googleapis.com/ffff.jpg
尝试使用 javascript 版本
尝试这个:
<html>
<head>
<script src="http://storage.googleapis.com/vrview/2.0/build/vrview.min.js"></script>
<script>
window.addEventListener('load', onVrViewLoad);
function onVrViewLoad() {
var vrView = new VRView.Player('#vrview', {
image: 'http://storage.googleapis.com/vrview/examples/coral.jpg',
is_stereo: true,
width: '100%',
height: 300
});
}
</script>
</head>
<body>
<div id="vrview"></div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
注意:chrome 无法访问硬盘上的文件。
编辑:这是由于CORS。
跨源资源共享 (CORS) 是一种机制,允许从提供第一个资源的域之外的另一个域请求网页上的受限资源。
感谢@Eleanor Zimmermann 注意到这一点。
| 归档时间: |
|
| 查看次数: |
2248 次 |
| 最近记录: |