Beispielprojekt des Mega-Plugins für WeChat-Mini-Programme schnell ausführen

Dieser Artikel beschreibt, wie Sie das Beispielprojekt des Mega-Plugins für WeChat-Mini-Programme schnell ausführen. Sie lernen:

Die Entwicklungsumgebung für das Beispielprojekt einzurichten und zu konfigurieren.
Einige Funktionen des Beispiels auszuführen und die Mega-Cloud-Lokalisierung zu verwenden.
Die Maskendatei aus den Kartierungsergebnissen anzuzeigen und die Ausrichtung des Modells an der realen Umgebung zu prüfen.

Bevor Sie beginnen

Prüfen Sie unter Kann ich die Lokalisierungsfunktion verwenden?, ob die Lokalisierungsdatenbank korrekt erstellt und Karten hinzugefügt wurden.

Prüfen, ob ein Unternehmen das Mini-Programm betreibt

Wichtig

Das Mega-Plugin unterstützt nur WeChat-Mini-Programme mit einem Unternehmen als Betreiber. Mini-Programme von Privatpersonen können das Mega-Plugin nicht verwenden.

Prüfen Sie in der Verwaltung des Mini-Programms, ob unter Einstellungen > Grundlegende Informationen > Angaben zum Betreiber juristische Person oder Einzelunternehmer angezeigt wird.

Da die Mega-Funktionen als Plugin bereitgestellt werden, benötigen Sie ein WeChat-Mini-Programm mit einem Unternehmen als Betreiber als Hostanwendung.

Auch wenn Sie nur unser Beispielprojekt ausführen möchten, müssen Sie die AppID Ihres eigenen WeChat-Mini-Programms konfigurieren, um es in den Entwicklerwerkzeugen zu debuggen und in der Vorschau anzuzeigen.

Beispielprojekt herunterladen

Öffnen Sie die Downloadseite für Entwicklerwerkzeuge.
Bestätigen Sie die Datenschutzerklärung von EasyAR und klicken Sie auf Herunterladen.
Entpacken Sie nach Abschluss des Downloads das .zip-Paket lokal.

Beispielprojekt konfigurieren

Melden Sie sich in den WeChat-Entwicklerwerkzeugen für Mini-Programme an.
Importieren Sie das Beispielprojekt mit den WeChat-Entwicklerwerkzeugen für Mini-Programme.
- Öffnen Sie die Entwicklerwerkzeuge, klicken Sie auf Importieren und wählen Sie das lokal entpackte Verzeichnis aus.
- Prüfen Sie, ob die AppID mit der bei der Beantragung der Mega-Lizenz angegebenen AppID übereinstimmt, wählen Sie den Entwicklungsmodus Mini-Programm und klicken Sie auf Erstellen.
Anmerkung

Eine abweichende AppID führt dazu, dass die Lizenzprüfung fehlschlägt
Mega-Lizenz und Cloud-Dienst konfigurieren

Öffnen Sie miniprogram/components/sample-data/easyar-settings.ts und füllen Sie die entsprechenden Felder anhand der Lizenz- und Dienstinformationen aus den Vorbereitungsschritten aus:
- Mega-Lizenz
```
/** Ihre Mega-Lizenz für das Mini Program */
export const EasyARLicenseKey: string = "";
```
So erhalten Sie eine Mega WeChat Mini Program-Lizenz

Wählen Sie im EasyAR Developer Center Mega WeChat Mini Program aus.

Die zu verwendende Mega WeChat Mini Program-Lizenz sollte in der Liste vorhanden sein. Wenn keine verfügbare Lizenz vorhanden ist, prüfen Sie, ob Ihr Konto mit dem Konto identisch ist, mit dem die Mega-Lokalisierungsdatenbank erstellt wurde.

Klicken Sie auf den Mini Program-Namen, um dessen Mega-Lizenz zu erhalten. Klicken Sie rechts auf Copy, fügen Sie sie in easyar-settings.ts als Wert von EasyARLicenseKey ein und bestätigen Sie, dass die zugehörige AppID exakt mit Ihrer WeChat Mini Program AppID übereinstimmt.
- Cloud-Dienst API Key und Seceret
```
/** Ihr API Key und Seceret für den Cloud-Dienst */
export const EasyARAPIKey: string = "";
export const EasyARAPISecret: string = "";
```
So erhalten Sie API Key und Seceret des Cloud-Dienstes

Wählen Sie im EasyAR Developer Center Cloud Service API KEY aus.

Wenn Sie bereits einen API Key und Seceret für den Cloud-Dienst erstellt haben, klicken Sie rechts nacheinander auf Copy und fügen Sie sie in easyar-settings.ts als Werte von EasyARAPIKey und EasyARAPISecret ein.

Wenn Sie zuvor noch keinen API Key und Seceret für den Cloud-Dienst erstellt haben, erstellen Sie sie wie folgt:

Wählen Sie im EasyAR Developer Center Cloud Service API KEY > Create API KEY aus.

Geben Sie den Anwendungsnamen ein, wählen Sie die zu verwendenden Cloud-Dienste aus: Mega Block und/oder Mega Landmark, und klicken Sie auf Confirm.
- Cloud-Dienst ServerAddress und AppID：
```
/** ServerAddress und AppID Ihrer Mega-Cloud-Lokalisierungsdatenbank */
export const MegaTrackerServerAddress: string = "";
export const MegaTrackerAppID: string = "";
```
So erhalten Sie ServerAddress und AppID einer Mega-Cloud-Lokalisierungsdatenbank

Wählen Sie im EasyAR Developer Center Block Cloud Localization und anschließend Ihre Mega-Cloud-Lokalisierungsdienstgruppe aus.

Wählen Sie Ihre Mega-Cloud-Lokalisierungsdatenbank aus:

Klicken Sie auf Key und rufen Sie darunter nacheinander AppID und Server Address der Cloud-Lokalisierungsdatenbank ab. Klicken Sie rechts auf Copy und fügen Sie sie in easyar-settings.ts als Werte von MegaTrackerAppID und MegaTrackerServerAddress ein.
Schnelle Prüfung mit der Maskendatei aus den Kartierungsergebnissen

Laden Sie die Maskendatei im Format glb über Maskendatei herunterladen aus der Cloud-Lokalisierungsdatenbank herunter. Mit dem weißen 3D-Modell der realen Umgebung können Sie die Ausrichtung ohne Anmerkungen prüfen.

Anmerkung

Dieser Weg gilt nur für Kartierungsergebnisse ab Version 9.6.

Suchen Sie den zu testenden Block in der Cloud-Lokalisierungsdatenbank und klicken Sie in der Spalte Aktionen auf Maskendatei herunterladen. Testen Sie am Ort dieses Blocks.

Wählen Sie im Popup Niedrige Genauigkeit und klicken Sie auf Herunterladen, um den Lade- und Renderaufwand auf dem Telefon zu reduzieren.

Legen Sie die heruntergeladenen glb-Dateien im Verzeichnis assets des Mini-Program-Projekts ab (miniprogram/assets/ im Beispielprojekt) und behalten Sie Position, Drehung und Skalierung jedes Modells bei.

Ändern Sie in miniprogram/components/sample-easyar-mega/index.ts den Wert src der Konfiguration occlusionMeshAssets in einen Pfad relativ zum Stammverzeichnis des Mini-Program-Projekts. Die Standardkonfiguration lautet:
```
const occlusionMeshAssets = [
    {
        assetId: "occlusionMesh00",
        type: "gltf",
        src: "assets/Low_Poly_occlusion.glb",
        options: {}
    },
];
```
Wenn die heruntergeladene Maskendatei mehrere GLB-Dateien enthält, fügen Sie für jede Datei einen Eintrag zu occlusionMeshAssets hinzu und vergeben Sie eine eindeutige assetId sowie den passenden src-Pfad. Das Beispiel lädt die Dateien, hängt die Maskennetze an den lokalisierten Block und wendet die integrierten Anzeige- und Verdeckungsmaterialien an. Mit Maskendatei auf der Seite blenden Sie die Netze ein oder aus. Die Ressourcen werden mit der Beispielkomponente freigegeben; zusätzliche Lade- oder Freigabelogik ist nicht erforderlich.

Beispiel auf einem echten Gerät ausführen

Klicken Sie in der oberen Leiste der Entwicklerwerkzeuge für Mini-Programme auf die Vorschau für echte Geräte und scannen Sie den QR-Code, um das Projekt auf das Testtelefon zu laden.

Vorsicht

xr-frame-Komponenten mit AR-Funktionen lassen sich in den Entwicklerwerkzeugen nicht direkt simulieren.

Anmerkung

Wenn Sie das Beispielprojekt erstmals in den WeChat-Entwicklerwerkzeugen ausführen und die Pluginberechtigung noch fehlt, erscheint normalerweise ein Hinweis. Erteilen Sie die Berechtigung in den Entwicklerwerkzeugen oder lesen Sie die Anleitung zur Pluginintegration
Klicken Sie auf EasyAR Mega Samples, um die AR-Szene des Beispielprojekts zu öffnen.

Anmerkung

Wenn sich die AR-Szene nicht öffnen lässt, unterstützt Ihr Gerät möglicherweise WeChat VisionKit nicht. Weitere Informationen finden Sie unter Geräteeinschränkungen.
Die Meldung EasyAR Session is initializing bedeutet, dass die WeChat-Ebenenerkennung initialisiert wird.

Tipp

Stellen Sie sicher, dass Sie in einer gut beleuchteten Umgebung testen, und vermeiden Sie große einfarbige Wände oder einfarbige Böden.

Richten Sie die Kamera auf den Boden oder eine andere ebene Fläche und bewegen Sie das Telefon gleichmäßig nach links und rechts.
Halten Sie das Telefon nach der Initialisierung senkrecht, damit die Kamera die reale Umgebung erfasst. Nach erfolgreicher Lokalisierung erscheint Found in den Debug-Informationen und die Statusanzeige unten rechts wechselt von Weiß zu Grün.
Ausrichtung der Maskendatei an der realen Umgebung prüfen

Warten Sie nach der Einrichtung der Maskendatei-Anzeige, bis das Modell geladen und der entsprechende Block erfolgreich lokalisiert wurde. Schalten Sie Maskendatei auf der Seite ein, um das weiße 3D-Modell über dem Kamerabild zu sehen und seine Ausrichtung an der realen Umgebung zu prüfen.