Forge Viewer - 黑色背景

问题描述 投票:0回答:1

是否可以为查看器背景设置特定颜色? 我试图将其设置为黑色,但我只能通过使用 setBackgroundColor 和灯光预设来获得一定的灰色阴影。

是否可以将其完全设置为特定颜色?

谢谢

autodesk-forge
1个回答
0
投票

是的,这是可能的。这是一个工作示例:

<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>

© www.soinside.com 2019 - 2024. All rights reserved.