Documentation de l'API

Certifications
Formations
    Prenez le contrôle total de la vue 3D et
    créez les experiences produit et configurateurs les plus poussés

    L'API complète d'Emersya vous permet de créer facilement et de manière transparente vos propres interfaces.

    Vous pourrez effectuer des changements parmi les options disponibles, passer d'un poin de vue à un autre, détecter les interactions provenant de la vue 3D, et bien plus encore.

    L'API Emersya fournit tout ce dont vous avez besoin pour créer les experiences d'achat les plus impressionnantes et cela sans compétences avancées en développement. Même des connaissances basiques en HTML et javascript suffisent.

    Exemple
    Les parties éditable et les matières disponibles listées ci-dessous seront utilisés dans tous les examples dans cette section.
    Parties éditables
    Matières disponibles

    Bonnes pratiques

    Grouper les appels à l'API

    Toujours essayer de créer votre code afin de grouper les appels à l'API

    Par exemple de pas oublier de :

    • Grouper les configurations dans le même appel à 'setMaterialsGroupConfigurations.'
    • Grouper tous les appels à 'setMaterialByName' dans la même transaction ou d'utiliser 'setMaterialsByName'.

    Dans le cas ou vous ne pouvez pas les regrouper, il est très important de toujours attendre l'événement "onSuccess" avant de faire un nouvel appel à l'API

    Éviter d'appeller des fonctions de configuration de l'API simultanément

    Ne pas appeller de nouvelle fonction de configuration avant d'avoir reçu l'événement "onSuccess" de la précédente

    Par exemple :
    - Ne pas appeller une transaction en même temp qu'un "setMaterialsGroupConfiguration".
    - Ne pas appeller de "setMaterialsGroupConfiguration" en même temps qu'un "applyPreset".
    - Ne pas appeller "applyPreset" en même temps qu'une transaction.

    • Ne pas appeller une transaction en même temp qu'un "setMaterialsGroupConfiguration".
    • Ne pas appeller de "setMaterialsGroupConfiguration" en même temps qu'un "applyPreset".
    • Ne pas appeller "applyPreset" en même temps qu'une transaction.

    Mettre à jour des éléments configurables

    Les fonctions updateCustomTexture et updateCustomText replace les textures de manière instantanée. Il est possible de voir la texture disparaitre durant le chargement de la nouvelle.

    La meilleur solution dans ce cas, est de faire la mise à jour pendant que la texture n'est pas visible et de la faire apparaitre après le chargement.

    Appeller les fonctions de l'API

    Une fois que l'iframe a été embarqué dans votre page, il vous est possible d'appeller les fonctions de l'API afin de prendre le control sur la 3D.

    Pour faire cela, il faut dans un premier temps récupérer le DOM de l'élément contenant l'iframe.

    viewerIframe = document.getElementById("emersyaIframe").contentWindow;

    Vous devrez ensuite appeller l'API avec la fonction postMessage

    Pour tous les appels à l'API, il est nécessaire d'avoir au préalable appeller la fonction registerCallback

    viewerIframe.postMessage({action : "registerCallback"}, "*");

    Écouter les évenemments de l'API

    La dernière étape est de recevoir les données envoyées par la visonneuse. Dans ce but, vous devrez premièrement ajouter un event listener sur votre "window" courante.

    Exemple : Comment récupérer l'état de la visionneuse durant le chargement :

    window.addEventListener("message", function(event){
       if(event && event.data && event.data.action == " onStateChange "){
        // The data is accessible in the event.data object
      }
    }, false);

    Quick Start

    Appliquer

    Tous les examples seront illustrés à partir du modèle 3D suivant :

    Les parties éditables sont :
    • logo
    • cube
    Le logo et le cube peuvent étre définis avec les paramètres suivant :
    • brushed metals
      brushed_metal
    • white_plastic
    • brushed metals
      black_plastic_mat
    • brushed metals
      beige_leather
    • glossy_gold
    • black_plastic
    • brushed metals
      glossy_bamboo
    • teal_plastic