WebVR扩展的基本应用实例
我试图在一个基本应用程序中使用WebVR扩展。下面的html显示的是一个2D模型，而不是VR中的3D模型。除了我称之为WebVR扩展的地方外，代码大多是样板。提前感谢！
<!DOCTYPE html>
<!-- vr.html -->
<head>
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=no" />
<meta charset="utf-8">
<!-- The Viewer CSS -->
<link rel="stylesheet" href="https://developer.api.autodesk.com/viewingservice/v1/viewers/style.min.css" type="text/css">
<!-- Developer CSS -->
<style>
body {
margin: 0;
}
#MyViewerDiv {
width: 100%;
height: 100%;
margin: 0;
background-color: #F0F8FF;
}
</style>
</head>
<body>
<!-- The Viewer will be instantiated here -->
<div id="MyViewerDiv"></div>
<!-- The Viewer JS -->
<script src="https://developer.api.autodesk.com/viewingservice/v1/viewers/three.min.js"></script>
<script src="https://developer.api.autodesk.com/viewingservice/v1/viewers/viewer3D.min.js"></script>
<!-- Developer JS -->
<script>
var viewerApp;
var options = {
env: 'AutodeskProduction',
// Here is the WebVR extension
extensions: ['Autodesk.Viewing.WebVR'],
getAccessToken: function(onGetAccessToken) {
//
// TODO: Replace static access token string below with call to fetch new token from your backend
// Both values are provided by Forge's Authentication (OAuth) API.
//
// Example Forge's Authentication (OAuth) API return value:
// {
// "access_token": "<YOUR_APPLICATION_TOKEN>",
// "token_type": "Bearer",
// "expires_in": 86400
// }
//
var accessToken = {{ accessToken }};
var expireTimeSeconds = 60 * 30;
onGetAccessToken(accessToken, expireTimeSeconds);
}
};
var documentId = {{ documentID }};
// var config = {
// extensions: ['Autodesk.Viewing.WebVR'],
// experimental: ['webVR_orbitModel']
// };
Autodesk.Viewing.Initializer(options, function(){
viewerApp = new Autodesk.Viewing.ViewingApplication('MyViewerDiv');
viewerApp.registerViewer(viewerApp.k3D, Autodesk.Viewing.Private.GuiViewer3D);
viewerApp.loadDocument(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);
});
function onDocumentLoadSuccess(doc) {
// We could still make use of Document.getSubItemsWithProperties()
// However, when using a ViewingApplication, we have access to the **bubble** attribute,
// which references the root node of a graph that wraps each object from the Manifest JSON.
var viewables = viewerApp.bubble.search({'type':'geometry'});
if (viewables.length === 0) {
console.error('Document contains no viewables.');
return;
}
// Choose any of the avialble viewables
viewerApp.selectItem(viewables[0].data, onItemLoadSuccess, onItemLoadFail);
}
function onDocumentLoadFailure(viewerErrorCode) {
console.error('onDocumentLoadFailure() - errorCode:' + viewerErrorCode);
}
function onItemLoadSuccess(viewer, item) {
console.log('onItemLoadSuccess()!');
console.log(viewer);
console.log(item);
// Congratulations! The viewer is now ready to be used.
console.log('Viewers are equal: ' + (viewer === viewerApp.getCurrentViewer()));
}
function onItemLoadFail(errorCode) {
console.error('onItemLoadFail() - errorCode:' + errorCode);
}
</script>
</body>
</html>其中{{ documentID }}是我的urn，{ accessToken }}是我的令牌。
回答 1
Stack Overflow用户
发布于 2017-05-23 01:31:08
首先，我不认为WebVR扩展适用于2D模型，我只是尝试了一个f2d文件，但它不起作用，您对VR中的2D有什么期望呢？
我还建议您使用viewer版本至少2.13，如果您不指定任何版本的查看器，它将在默认情况下使用2.12作为我试过。如果您在WebVR上查看https://developer.api.autodesk.com/viewingservice/v1/viewers/viewer3D.js?v=2.12扩展的查看器2.12代码，当浏览器本机不支持WebVR时，您将看到它不使用WebVR-poly填充。但是，由于查看器2.13中添加了下面的代码以支持WebVR -poly填充，这使得您的浏览器支持WebVR，即使它本机还不支持WebVR。
// check if browser supports webVR1.1 natively, if not, load polyfill
avp.loadDependency('VRFrameData', 'webvr-polyfill.min.js', function() {})最后，我有一个简单的运行示例，用于WebVR at https://viewervr.herokuapp.com，如果您想检查结果，只需加载“Autodesk.Viewing.WebVR”扩展，如果您在移动设备上运行它，您将看到预期的结果。
希望能帮上忙。
https://stackoverflow.com/questions/44124001
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号