是否可以为查看器背景设置特定颜色? 我试图将其设置为黑色,但我只能通过使用 setBackgroundColor 和灯光预设来获得一定的灰色阴影。
是否可以将其完全设置为特定颜色?
谢谢
是的,这是可能的。这是一个工作示例:
<html>
<head>
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=no" />
<meta charset="utf-8">
<link rel="stylesheet" href="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/style.min.css"
type="text/css">
<script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/viewer3D.min.js"></script>
<style>
body {
margin: 0;
}
#forgeViewer {
width: 100%;
height: 100%;
margin: 0;
}
.adsk-viewing-viewer {
background: none;
}
</style>
</head>
<body>
<div id="forgeViewer"></div>
<script>
function fetchForgeToken(callback) {
fetch('http://localhost:8090/api/oauth/token', {
method: 'get',
headers: new Headers({ 'Content-Type': 'application/json' })
})
.then((response) => {
if (response.status === 200) {
return response.json();
} else {
return Promise.reject(
new Error(`Failed to fetch token from server (status: ${response.status}, message: ${response.statusText})`)
);
}
})
.then((data) => {
if (!data) return Promise.reject(new Error('Empty token response'));
callback(data.access_token, data.expires_in);
})
.catch((error) => console.error(error));
}
async function loadViewAsync(viewer, urn, viewableId) {
return new Promise((resolve, reject) => {
async function onDocumentLoadSuccess(doc) {
await doc.downloadAecModelData();
let viewable = (viewableId ? doc.getRoot().findByGuid(viewableId) : doc.getRoot().getDefaultGeometry());
let model = await viewer.loadDocumentNode(doc, viewable);
await viewer.waitForLoadDone();
resolve(model);
}
function onDocumentLoadFailure() {
reject(new Error('Failed fetching Forge manifest'));
}
Autodesk.Viewing.Document.load(urn, onDocumentLoadSuccess, onDocumentLoadFailure);
});
}
Autodesk.Viewing.Initializer({ env: 'AutodeskProduction', getAccessToken: fetchForgeToken }, async function () {
const config3d = {
modelBrowserStartCollapsed: true,
modelBrowserExcludeRoot: false,
};
Autodesk.Viewing.Private.InitParametersSetting.alpha=true;
let viewer = new Autodesk.Viewing.GuiViewer3D(document.getElementById('forgeViewer'), config3d);
let startedCode = viewer.start();
if (startedCode > 0) {
console.error('Failed to create a Viewer: WebGL not supported.');
return;
}
const customAecProfileSettings = Autodesk.Viewing.ProfileSettings.clone(Autodesk.Viewing.ProfileSettings.AEC);
customAecProfileSettings.settings.envMapBackground = false;
const profile = new Autodesk.Viewing.Profile(customAecProfileSettings);
viewer.setProfile(profile);
let documentId = 'urn:dXJuOmFkc2sub2J...dC0yMDIzLnJ2dA';
let mainModel = await loadViewAsync(viewer, documentId);
viewer.setBackgroundColor(0,0,0,0,0,0);
});
</script>
</body>
</html>