Interaktive Karten, 3D-Dashboards und Modell-Viewer, die mit WebGL erstellt wurden, sehen im Browser großartig aus, aber Beteiligte benötigen oft eine feste, teilbare Version: einen Kartenschnappschuss in einem Bericht, ein 3D-Design in einem Genehmigungspaket, ein Simulationsergebnis in einem Archiv. IronPDF erfasst GPU-beschleunigte WebGL-Inhalte als statisches PDF in C#, wobei der visuelle Zustand der Szene im Moment der Darstellung erhalten bleibt.

Das geschäftliche Problem

Ein Logistik-Tool zeigt Routen auf einer Mapbox-Karte, eine Immobilien-App zeigt 3D-Gelände an, eine Ingenieur-App rendert ein CAD-Modell im Browser. Jede benötigt eine PDF-Version für einen Bericht, einen Datensatz oder einen Empfänger, der keinen Zugriff auf die Live-Anwendung hat. Ein normaler Screenshot ist von geringer Qualität und manuell, und standardisierte HTML-zu-PDF-Konvertierung erfasst kein WebGL, das von der GPU abhängt.

Konfiguration des Renderings

WebGL-Erfassung benötigt drei Einstellungen: Einzelprozessmodus, Hardware-GPU-Modus und eine Verzögerung, damit die Szene fertig gerendert wird, bevor sie erfasst wird.

using IronPdf;

// Required for WebGL: GPU operations must complete in one process
IronPdf.Installation.SingleProcess = true;
IronPdf.Installation.ChromeGpuMode = IronPdf.Engines.Chrome.ChromeGpuModes.Hardware;

ChromePdfRenderer renderer = new ChromePdfRenderer();

// Give the 3D scene time to load and render
renderer.RenderingOptions.WaitFor.RenderDelay(5000);

PdfDocument pdf = renderer.RenderUrlAsPdf("https://docs.mapbox.com/mapbox-gl-js/example/geojson-layer-in-slot/");
pdf.SaveAs("webgl.pdf");

using IronPdf;

// Required for WebGL: GPU operations must complete in one process
IronPdf.Installation.SingleProcess = true;
IronPdf.Installation.ChromeGpuMode = IronPdf.Engines.Chrome.ChromeGpuModes.Hardware;

ChromePdfRenderer renderer = new ChromePdfRenderer();

// Give the 3D scene time to load and render
renderer.RenderingOptions.WaitFor.RenderDelay(5000);

PdfDocument pdf = renderer.RenderUrlAsPdf("https://docs.mapbox.com/mapbox-gl-js/example/geojson-layer-in-slot/");
pdf.SaveAs("webgl.pdf");

Das Ergebnis erfasst die Karte, das Diagramm oder das Modell genau so, wie es erschien, geeignet für Dokumentation, Berichte und Archivierung.

Punkte, die zu planen sind

Diese Funktion hat reale Umgebungsanforderungen, die entscheiden, ob sie zu einer bestimmten Bereitstellung passt.

• Eine echte GPU ist erforderlich: Der Hardware-GPU-Modus ist obligatorisch. Software-Rendering kann keine Shader, Texturen und 3D-Transformationen verarbeiten, daher benötigt der Host eine kompatible GPU mit aktuellen Treibern.
• Docker wird nicht unterstützt: WebGL-Rendering funktioniert nicht in standardmäßigen Docker-Containern, die headless sind und nur eingeschränkten GPU-Zugriff haben. Die Umgehungsmöglichkeiten sind eine VM oder ein dedizierter Server mit GPU-Unterstützung, ein Microservice, der auf einem GPU-Host läuft, oder das Vor-Rendern von Szenen zu statischen Bildern.
• Ausgabe ist ein Schnappschuss: Das PDF bewahrt den visuellen Zustand zur Renderzeit. Panning, Zoom und andere Interaktivität werden nicht beibehalten, weshalb es besser für Dokumentation und Archivierung als für interaktive Lieferung geeignet ist.
• Stellen Sie die Renderverzögerung ein: Komplexe Szenen benötigen Zeit zum Laden. Werte zwischen 3000 und 10000 Millisekunden sind ein vernünftiger Bereich zum Testen, da ein zu kurzer Wert das Rendern abschneidet und ein zu langer Zeit verschwendet.
• Einzelprozessmodus ist global: Er ist hier erforderlich, beeinflusst jedoch die Parallelität, was in einem Service mit hohem Volumen abzuwägen ist.

Ergebnis

Mit aktiviertem GPU-Modus und einem geeigneten Host wandeln Teams Live-WebGL-Karten, Dashboards und 3D-Modelle in statische PDFs um, die in Berichte und Archive gelangen. Die vollständige Konfiguration und die Schritte zur Fehlerbehebung finden Sie im WebGL-Render-Leitfaden.