如何在浏览器上 Show/View 或读取 .dwg 文件
How to Show/View or Read .dwg files on browser
如何在不使用任何软件的情况下在浏览器上显示或读取 .dwg 文件意味着使用 PHP、jQuery、Javascript 或任何其他编程语言。
为此,我已经完成 https://developer.autodesk.com 并创建了一个具有客户端 ID 和客户端密码的应用程序,还创建了 index.html 文件。但在那之后,我陷入了寻找下一个动作以获得所需 "Model Derivative API" 的困境。所以请指导我。感谢您给予宝贵的答复。
<!-- 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>
<!-- 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 viewer;
var options = {
env: 'AutodeskProduction',
accessToken: '<YOUR_APPLICATION_TOKEN>'
};
var documentId = 'urn:<YOUR_URN_ID>';
Autodesk.Viewing.Initializer(options, function onInitialized(){
Autodesk.Viewing.Document.load(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);
});
/**
* Autodesk.Viewing.Document.load() success callback.
* Proceeds with model initialization.
*/
function onDocumentLoadSuccess(doc) {
// A document contains references to 3D and 2D viewables.
var viewables = Autodesk.Viewing.Document.getSubItemsWithProperties(doc.getRootItem(), {'type':'geometry'}, true);
if (viewables.length === 0) {
console.error('Document contains no viewables.');
return;
}
// Choose any of the avialble viewables
var initialViewable = viewables[0];
var svfUrl = doc.getViewablePath(initialViewable);
var modelOptions = {
sharedPropertyDbPath: doc.getPropertyDbPath()
};
var viewerDiv = document.getElementById('MyViewerDiv');
viewer = new Autodesk.Viewing.Private.GuiViewer3D(viewerDiv);
viewer.start(svfUrl, modelOptions, onLoadModelSuccess, onLoadModelError);
}
/**
* Autodesk.Viewing.Document.load() failuire callback.
*/
function onDocumentLoadFailure(viewerErrorCode) {
console.error('onDocumentLoadFailure() - errorCode:' + viewerErrorCode);
}
/**
* viewer.loadModel() success callback.
* Invoked after the model's SVF has been initially loaded.
* It may trigger before any geometry has been downloaded and displayed on-screen.
*/
function onLoadModelSuccess(model) {
console.log('onLoadModelSuccess()!');
console.log('Validate model loaded: ' + (viewer.model === model));
console.log(model);
}
/**
* viewer.loadModel() failure callback.
* Invoked when there's an error fetching the SVF file.
*/
function onLoadModelError(viewerErrorCode) {
console.error('onLoadModelError() - errorCode:' + viewerErrorCode);
}
</script>
您可以在 A360 Viewer 轻松在线测试。
您指出的代码只是页面,请注意它是如何缺少 TOKEN 和 URN 的。事实上,遵循 Viewer tutorial you'll notice a Prepare your file for viewing 教程。
在任何情况下,您都需要一个上传和 post 翻译作业的后端,我们的 github account.
有一些示例
更新
无需编程即可展示模型:您可以在您的网站上轻松分享您的 A360 模型,步骤如下:
- 转到 A360 并登录(或注册)
- 使用现有项目或创建新项目。
- 在项目中,单击 上传 和 select 您机器上的文件。翻译过程将自动开始。或者您可以使用项目中的现有文件。
- 在右上角的图标上,单击 "Share" 选项。
- 在弹出窗口中,转到 嵌入 选项卡,然后 select 大小。复制 HTML 并粘贴到您的网站上。
如何在不使用任何软件的情况下在浏览器上显示或读取 .dwg 文件意味着使用 PHP、jQuery、Javascript 或任何其他编程语言。 为此,我已经完成 https://developer.autodesk.com 并创建了一个具有客户端 ID 和客户端密码的应用程序,还创建了 index.html 文件。但在那之后,我陷入了寻找下一个动作以获得所需 "Model Derivative API" 的困境。所以请指导我。感谢您给予宝贵的答复。
<!-- 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>
<!-- 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 viewer;
var options = {
env: 'AutodeskProduction',
accessToken: '<YOUR_APPLICATION_TOKEN>'
};
var documentId = 'urn:<YOUR_URN_ID>';
Autodesk.Viewing.Initializer(options, function onInitialized(){
Autodesk.Viewing.Document.load(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);
});
/**
* Autodesk.Viewing.Document.load() success callback.
* Proceeds with model initialization.
*/
function onDocumentLoadSuccess(doc) {
// A document contains references to 3D and 2D viewables.
var viewables = Autodesk.Viewing.Document.getSubItemsWithProperties(doc.getRootItem(), {'type':'geometry'}, true);
if (viewables.length === 0) {
console.error('Document contains no viewables.');
return;
}
// Choose any of the avialble viewables
var initialViewable = viewables[0];
var svfUrl = doc.getViewablePath(initialViewable);
var modelOptions = {
sharedPropertyDbPath: doc.getPropertyDbPath()
};
var viewerDiv = document.getElementById('MyViewerDiv');
viewer = new Autodesk.Viewing.Private.GuiViewer3D(viewerDiv);
viewer.start(svfUrl, modelOptions, onLoadModelSuccess, onLoadModelError);
}
/**
* Autodesk.Viewing.Document.load() failuire callback.
*/
function onDocumentLoadFailure(viewerErrorCode) {
console.error('onDocumentLoadFailure() - errorCode:' + viewerErrorCode);
}
/**
* viewer.loadModel() success callback.
* Invoked after the model's SVF has been initially loaded.
* It may trigger before any geometry has been downloaded and displayed on-screen.
*/
function onLoadModelSuccess(model) {
console.log('onLoadModelSuccess()!');
console.log('Validate model loaded: ' + (viewer.model === model));
console.log(model);
}
/**
* viewer.loadModel() failure callback.
* Invoked when there's an error fetching the SVF file.
*/
function onLoadModelError(viewerErrorCode) {
console.error('onLoadModelError() - errorCode:' + viewerErrorCode);
}
</script>
您可以在 A360 Viewer 轻松在线测试。
您指出的代码只是页面,请注意它是如何缺少 TOKEN 和 URN 的。事实上,遵循 Viewer tutorial you'll notice a Prepare your file for viewing 教程。
在任何情况下,您都需要一个上传和 post 翻译作业的后端,我们的 github account.
有一些示例更新
无需编程即可展示模型:您可以在您的网站上轻松分享您的 A360 模型,步骤如下:
- 转到 A360 并登录(或注册)
- 使用现有项目或创建新项目。
- 在项目中,单击 上传 和 select 您机器上的文件。翻译过程将自动开始。或者您可以使用项目中的现有文件。
- 在右上角的图标上,单击 "Share" 选项。
- 在弹出窗口中,转到 嵌入 选项卡,然后 select 大小。复制 HTML 并粘贴到您的网站上。