Autodesk Forge Viewer dans Sharepoint affiche uniquement le modèle noir
P粉265724930
P粉265724930 2023-09-02 20:17:59
0
1
461

Pour notre projet actuel, nous avons suivi ce tutoriel pour intégrer Forge Viewer dans Sharepoint. (https://aps.autodesk.com/blog/sharepoint-online-integration)

Ensuite, nous avons configuré le projet dans React à l'aide de ce package npm. https://www.npmjs.com/package/react-forge-viewer.

Après la migration du projet vers React, le visualiseur a perdu toute couleur et est devenu noir.

Selon le message d'erreur, la propriété n'est toujours pas définie au chargement de la visionneuse. Ce problème ne s'est pas produit lors de l'utilisation uniquement de SPFX, mais uniquement après avoir utilisé React.

Merci beaucoup pour votre aide !

Message d'erreur

Visionneuse incolore

P粉265724930
P粉265724930

répondre à tous (1)
P粉884548619

On dirait que le projetreact-forge-viewer(développé par la communauté) n'a pas été mis à jour au cours des 3 dernières années. Pour exclure tout problème dans ce projet, je recommande de le remplacer par votre propre wrapper React simple. Quelque chose comme :

  • Ajoutez une dépendance de visionneuse à votre HTML :
  • Créez un simple wrapper React qui code temporairement en dur le jeton d'accès et l'URN du modèle :
// Viewer.js import React from 'react'; import './Viewer.css'; const Autodesk = window.Autodesk; const ACCESS_TOKEN = '...'; const URN = '...'; async function initializeViewer(container) { return new Promise(function (resolve, reject) { Autodesk.Viewing.Initializer({ accessToken: ACCESS_TOKEN }, function () { const viewer = new Autodesk.Viewing.GuiViewer3D(container); viewer.start(); resolve(viewer); }); }); } async function loadModel(viewer, urn) { return new Promise(function (resolve, reject) { function onDocumentLoadSuccess(doc) { resolve(viewer.loadDocumentNode(doc, doc.getRoot().getDefaultGeometry())); } function onDocumentLoadFailure(code, message, errors) { reject({ code, message, errors }); } Autodesk.Viewing.Document.load('urn:' + urn, onDocumentLoadSuccess, onDocumentLoadFailure); }); } class Viewer extends React.Component { constructor(props) { super(props); this.ref = React.createRef(); this.viewer = null; } componentDidMount() { if (!this.viewer) { this.viewer = initializeViewer(this.ref.current); this.viewer.then(viewer => loadModel(viewer, URN)); } } render() { return ( 
); } } export { Viewer };
/* Viewer.css */ .viewer { position: relative; width: 800px; height: 600px; }
  • Enfin, insérez le composantdans votre application.

Si le problème persiste même avec ce simple composant React, essayez d'utiliser le composant dans une application React autonome pour exclure tout problème potentiel introduit par l'environnement Sharepoint.

    Derniers téléchargements
    Plus>
    effets Web
    Code source du site Web
    Matériel du site Web
    Modèle frontal
    À propos de nous Clause de non-responsabilité Sitemap
    Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!