Table of Contents

Ejecutar rápidamente el proyecto sample del plugin Mega para mini program de WeChat

Este artículo describe cómo ejecutar rápidamente el proyecto sample del plugin Mega para mini program de WeChat. Aprenderá a:

  • Configurar el development environment del proyecto sample.
  • Ejecutar parte de las funciones del sample: usar Mega cloud localization.
  • Mostrar el archivo de máscara de los resultados de mapeo.

Antes de empezar

Confirmar que el sujeto del mini program es una enterprise entity

Importante

El plugin Mega mini program solo admite WeChat mini program con enterprise entity. Los mini program de tipo individual entity no pueden usar el plugin Mega mini program.

Debe confirmar que Settings > Basic Information > Entity Information en el backend del mini program muestra enterprise legal person o individual industrial and commercial household.

Como las funciones Mega se proporcionan en forma de plugin de mini program, debe tener un WeChat mini program con enterprise entity como host environment.

Incluso si solo desea ejecutar el proyecto sample que proporcionamos, debe configurar su propio WeChat mini program AppID para debug y preview en developer tool.

Descargar el proyecto sample

  1. Vaya a la página de descarga de development tool.

  2. Después de confirmar EasyAR Privacy Policy, haga clic en download.

    Download Sample

  3. Una vez completada la descarga, descomprima localmente el paquete .zip.

Configurar el proyecto sample

  1. Inicie sesión en WeChat Mini Program Developer Tools.

  2. Use WeChat Mini Program Developer Tools para importar el proyecto de ejemplo.

    • Después de abrir Developer Tools, haga clic en el botón import y seleccione el directorio extraído localmente.

    Importar Developer Tools

    Seleccionar directorio local

    • Asegúrese de que AppID sea el mismo que el AppID rellenado al solicitar la licencia Mega, que el modo de desarrollo sea Mini Program, y haga clic en Create.
    Nota

    Un AppID inconsistente hará que falle la verificación de licencia

    Opciones de importación de Developer Tools

  3. Configurar la licencia Mega y el servicio en la nube

    Abra miniprogram/components/sample-data/easyar-settings.ts y rellene los campos correspondientes según la información de licencia y servicio de los preparativos:

    • Licencia Mega
    /** 您的小程序 Mega 许可证 */
    export const EasyARLicenseKey: string = "";
    
    Cómo obtener una licencia Mega WeChat Mini Program

    En EasyAR Developer Center, seleccione Mega WeChat Mini Program.

    Lista de licencias

    La licencia Mega WeChat Mini Program que desea usar debe existir en la lista. Si no hay licencia disponible, compruebe si su cuenta es la misma que se usó para crear la base de localización Mega.

    Haga clic en el nombre de Mini Program para obtener su licencia Mega. Haga clic en Copy a la derecha, péguela en easyar-settings.ts como valor de EasyARLicenseKey, y confirme que su AppID asociado coincide exactamente con el AppID de su WeChat Mini Program.

    Detalles de licencia


    • API Key y Seceret del servicio en la nube
    /** 您的云服务 API Key 及 Seceret */
    export const EasyARAPIKey: string = "";
    export const EasyARAPISecret: string = "";
    
    Cómo obtener API Key y Seceret del servicio en la nube

    En EasyAR Developer Center, seleccione Cloud Service API KEY.

    Si ya creó API Key y Seceret del servicio en la nube, haga clic en Copy a la derecha en secuencia y péguelos en easyar-settings.ts como valores de EasyARAPIKey y EasyARAPISecret.

    Cloud service API KEY

    Si no ha creado API Key y Seceret del servicio en la nube antes, créelos de la siguiente manera:

    En EasyAR Developer Center, seleccione Cloud Service API KEY > Create API KEY.

    Crear API KEY

    Detalles de creación de API KEY

    Introduzca el nombre de la aplicación, seleccione los servicios en la nube que necesita usar: Mega Block y/o Mega Landmark, y haga clic en Confirm.


    • ServerAddress y AppID del servicio en la nube
    /** 您的 Mega 云定位库的 ServerAddress 及 AppID */
    export const MegaTrackerServerAddress: string = "";
    export const MegaTrackerAppID: string = "";
    
    Cómo obtener ServerAddress y AppID de la base de localización en la nube Mega

    En EasyAR Developer Center, seleccione Block Cloud Localization y luego su grupo de servicio de localización en la nube Mega.

    Seleccionar grupo de servicio de localización en la nube

    Seleccione su base de localización en la nube Mega:

    Seleccionar base de localización en la nube

    Obtener información de localización en la nube

    Haga clic en Key y obtenga abajo, en secuencia, el AppID y Server Address de la base de localización en la nube. Haga clic en Copy a la derecha y péguelos en easyar-settings.ts como valores de MegaTrackerAppID y MegaTrackerServerAddress.

  4. Verificación rápida con el archivo de máscara de los resultados de mapeo

    Puede descargar el archivo de máscara glb desde los resultados de mapeo mediante Mask file download, mostrar el modelo blanco 3D del entorno real y comprobar la alineación sin crear annotations.

    Nota

    Este método solo se aplica a resultados de mapeo de la versión 9.6 o posterior.

    En la base de datos de localización en la nube, busque el Block que desea probar y haga clic en Mask file download en la columna Action. Durante la ejecución, pruebe en la escena correspondiente a este Block.

    Entrada de descarga del archivo de máscara

    En la ventana emergente, seleccione Low precision y haga clic en Download para reducir la carga de lectura y renderizado en el teléfono.

    Descargar archivo de máscara

    Coloque el archivo glb descargado en el directorio assets del proyecto Mini Program, por ejemplo miniprogram/assets/, manteniendo su posición, rotación y escala originales.

    El proyecto sample ya incluye la lógica para cargar, mostrar y liberar el archivo. Coloque, por ejemplo, occlusion_mesh_sd.glb en miniprogram/assets/ y escriba la ruta relativa en sampleAssets.occlusionMesh.src:

    src: "assets/occlusion_mesh_sd.glb",
    

    Mantenga sin cambios assetId, type y options de sampleAssets.occlusionMesh. Después de ejecutar el sample, active el interruptor Mask file en la página para ver el modelo.

Ejecutar el sample en un dispositivo real

  1. Haga clic en el botón real-device preview de la barra superior de la Mini Program developer tool y cárguelo en el teléfono de desarrollo escaneando el QR code.

    Precaución

    No se pueden simular y ejecutar directamente componentes xr-frame con funciones AR en la developer tool. Simulated run

    QR code loading

    Nota

    Cuando ejecute el sample project en WeChat Developer Tools por primera vez, si aún no ha obtenido plugin permission, la herramienta normalmente mostrará una ventana emergente indicando que el plugin no está autorizado. Puede autorizarlo automáticamente mediante WeChat Developer Tools o consultar plugin access process

  2. Haga clic en EasyAR Mega Samples para entrar en la AR scene del sample project.

    Sample entry

    Nota

    Si no puede entrar en la AR scene del sample project, puede deberse a que el device actual no admite el componente de algoritmo visual VisionKit de WeChat. Para más detalles, consulte device restrictions.

  3. El mensaje EasyAR Session is initializing en la pantalla indica que WeChat plane detection se está inicializando.

    Consejo

    Asegúrese de probar en un entorno bien iluminado y evite paredes o suelos de color liso de gran superficie.

    Mueva el dispositivo a izquierda y derecha a velocidad constante apuntando al suelo u otra plane para acelerar este proceso.

    Initialization

  4. Después de completar la inicialización, sostenga el teléfono en vertical para que la cámara capture una vista normal del mundo real. Cuando la localization se realiza correctamente, aparece Found en la información Debug y el indicador de estado de la parte inferior derecha cambia de blanco a verde.

    Localization

  5. Ver el efecto de oclusión

    Después de completar la configuración de visualización del archivo de máscara, cuando el modelo se haya cargado y localizado correctamente en el Block correspondiente, podrá ver el modelo blanco 3D superpuesto sobre la imagen de la cámara.

    Oclusión densa

Pasos siguientes

Temas relacionados