- 1
Den Rahmen einfügen
Füge einen iframe ein, der auf Any3D verweist, und trage deine Modelladresse in den src-Parameter ein. Der Rahmen zeigt nur die Leinwand mit einer Schaltfläche unten rechts, die den vollen Viewer öffnet. Ein Beispiel folgt unten.
<iframe src="https://any3d.cc/de-DE/embed?src=https%3A%2F%2Fcdn.example.com%2Fmodel.glb" title="3D-Modell" style="width:100%;height:480px;border:0" loading="lazy" allow="fullscreen" allowfullscreen referrerpolicy="strict-origin-when-cross-origin" ></iframe>Tipp: Du kannst den folgenden Prompt kopieren und an einen KI-Assistenten (wie Cursor, Claude oder ChatGPT) übergeben, um den Einbettungscode schnell zu erstellen.KI-Integrationsprompt (zum Aus-/Einklappen klicken)
Erstelle bitte einen <iframe>-Code zum Einbetten des Any3D 3D-Viewers in eine Webseite. Wenn eine bestehende Seite oder Komponente bearbeitet wird, platziere den <iframe> an der Stelle, an der das 3D-Modell erscheinen soll. Basis-URL der Einbettung: https://any3d.cc/de-DE/embed URL- und Parameterregeln: - Erforderlicher Parameter: `src` muss die HTTPS-Adresse des Modells sein, prozentkodiert (encodeURIComponent) und als eigener Abfrageparameter übergeben werden (z. B. https://any3d.cc/de-DE/embed?src=...). Die rohe Modelladresse darf nicht direkt an den Pfad angehängt werden. Für 3D Tiles ist die Adresse der tileset.json zu verwenden. - Optionale Parameter (nicht benötigte weglassen): - `autorotate=1`: Dreht das Modell automatisch. Weglassen, um es stillstehen zu lassen. - `theme=light`, `theme=dark` oder `theme=system`: Legt das Farbschema fest. - `bg=transparent`: Verwendet einen transparenten Hintergrund. - `controls`: Wählt die Maussteuerung. Leer lassen oder auf `auto` setzen, um die Steuerung passend zum Dateityp automatisch zu wählen; alternativ `standard`, `cad`, `solidworks`, `blender`, `splat` oder `custom`. Maussteuerungen: - auto: CAD-Dateien nutzen CAD-Steuerung, Gaussian Splatting sanfte Umlaufbahn, alle anderen Orbit. - standard: Orbit. Linke Taste dreht, rechte verschiebt, Mausrad zoomt. - cad: AutoCAD-Stil. Mittlere Taste verschiebt, Shift+mittlere Taste dreht, Mausrad zoomt zum Cursor, keine Trägheit. Linke Taste dreht ebenfalls, rechte verschiebt. - solidworks: SolidWorks-Stil. Mittlere Taste dreht, Strg/Befehlstaste+mittlere Taste verschiebt, Shift+mittlere Taste zoomt. Mausrad nach vorne verkleinert am Cursor, keine Trägheit. - blender: Blender-Stil. Mittlere Taste dreht, Shift+mittlere Taste verschiebt, Strg/Befehlstaste+mittlere Taste zoomt. Mausrad zoomt zur Ansichtsmitte, keine Trägheit. - splat: Sanfte Umlaufbahn für große Gaussian-Splatting-Szenen. Ziehen für weiche Drehung, Doppelklick setzt Fokuspunkt. - custom: entspricht standard. iframe-Anforderungen und Hinweise: - Attribute und Styling: loading="lazy" und style="width:100%;height:480px;border:0" einbinden (an Containergröße anpassbar). - Berechtigungen: allow="fullscreen", allowfullscreen und referrerpolicy="strict-origin-when-cross-origin" sind erforderlich. - Sandbox: Wenn die Elternseite eine Sandbox verwendet, müssen allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox gesetzt sein, damit die Schaltfläche in der Ecke den vollständigen Viewer in einem neuen Tab öffnen kann. - Hosting und CORS: Der Host des Modells muss https://any3d.cc per CORS erlauben. Der Viewer lädt eine einzelne Datei herunter (z. B. GLB, STL, OBJ, FBX, PLY). Texturen in separaten Dateien fehlen, wenn sie nicht im Modell integriert sind. Beispiel: <iframe src="https://any3d.cc/de-DE/embed?src=https%3A%2F%2Fcdn.example.com%2Fmodel.glb" title="3D-Modell" style="width:100%;height:480px;border:0" loading="lazy" allow="fullscreen" allowfullscreen referrerpolicy="strict-origin-when-cross-origin" ></iframe> Hinweis: Die Modelladresse im Beispiel ist ein Platzhalter. Ersetze src durch die echte, prozentkodierte HTTPS-Adresse. Wenn die Maussteuerung automatisch der Datei folgen soll, lass den Parameter controls weg. - 2
Wo das Modell liegt
Die Adresse muss https sein, und der Host muss https://any3d.cc das Lesen der Datei erlauben. Der Browser des Besuchers lädt diese eine Datei, zum Beispiel GLB, STL, OBJ, FBX oder PLY. Für 3D Tiles nimm die Adresse von tileset.json. Any3D speichert keine Kopie. Texturen und Daten in eigenen Dateien fehlen, wenn sie nicht wie bei GLB im Modell stecken.
- 3
Optionen der Seite
Die folgenden Parameter sind optional. Die Schaltfläche zum Öffnen des vollen Viewers bleibt sichtbar.
Parameter Wert Wirkung autorotate1Dreht das Modell. Ohne den Parameter bleibt es still. themelight | dark | systemSetzt das Thema der Seite. bgtransparentMacht den Hintergrund durchsichtig. controlsauto | standard | cad | solidworks | blender | splat | customMausbedienung. Leer bedeutet auto und folgt der Datei. https://any3d.cc/de-DE/embed ?src=https%3A%2F%2Fcdn.example.com%2Fmodel.glb &autorotate=1 &theme=dark &bg=transparent - 4
Den vollen Viewer öffnen
Die Schaltfläche öffnet den passenden Any3D-Viewer in einem neuen Tab und übergibt dieselbe Modelladresse. Gaussian Splats, 3D Tiles und Zeichnungen in DWG oder DXF nutzen ihre eigenen Viewer. Andere Dateien nutzen den 3D-Modell-Viewer. Wenn die übergeordnete Seite das iframe mit sandbox einschränkt, braucht die Schaltfläche allow-popups und allow-popups-to-escape-sandbox.
Viewer einbetten
Setze einen Any3D-Viewer auf deine eigene Seite. Der Rahmen lädt ein Modell von einer https-Adresse und enthält eine Schaltfläche, die den vollen Viewer öffnet.