Red de conocimiento informático - Material del sitio web - ¿Cómo introducir a Gaudí en la página web front-end? ¿Cuáles son los pasos específicos?

¿Cómo introducir a Gaudí en la página web front-end? ¿Cuáles son los pasos específicos?

En realidad, esto es muy simple y no es difícil. Primero debe registrarse como desarrollador, luego crear la aplicación, agregar valores clave y finalmente introducir el mapa en la página HTML a través de JS. Permítanme presentarles brevemente el proceso de implementación. Los contenidos principales son los siguientes:

1. Primero, regístrese como desarrollador de mapas de Amap. Simplemente regístrese directamente en la "Plataforma abierta Amap" de la siguiente manera. Ingrese la información de registro relevante y pronto tendrá éxito:

2. Después del registro exitoso, inicie sesión en su cuenta. Aquí primero debemos crear una aplicación, luego hacer clic en "Centro personal" -> "Administración de aplicaciones" -> "Mi aplicación", cambiar a la interfaz de administración de aplicaciones, hacer clic en el botón "Nueva aplicación" en la esquina superior derecha, Aparece la siguiente ventana, solo necesitamos ingresar el nombre y la categoría de la aplicación:

Después de una creación exitosa, la aplicación recién creada aparecerá en la interfaz de administración de aplicaciones. Luego, hacemos clic en el icono en el lado derecho de la aplicación para agregar un valor clave a la aplicación como se muestra a continuación. Ingrese el nombre de la clave aquí y seleccione "JSAPI":

Después de que la adición sea exitosa, el valor de la clave es el siguiente, que se utilizará en el siguiente código:

3. Ahí está la introducción del mapa. Este es muy simple. Primero, debe crear un contenedor div y luego introducir el mapa en este contenedor a través de JSAPI. El código de prueba es el siguiente, muy sencillo:

Guarde el archivo de esta página web y ábralo con un navegador. El efecto es el siguiente. Amap se ha lanzado con éxito:

4. También podemos importar mapas del metro aquí. De hecho, los pasos son similares a los pasos anteriores para importar mapas normales. También necesitamos crear primero los contenedores div y luego importarlos a través de JSAPI. El código de prueba es el siguiente:

Guarde el archivo y ábralo con un navegador. El efecto es el siguiente. El mapa del metro se lanzó con éxito:

En este punto, hemos completado la introducción del mapa de Amap en la página web del front-end. En general, todo el proceso es muy simple: simplemente cree una aplicación, agregue un valor clave y luego importe el mapa al contenedor div de la página web a través de JSAPI. Siempre que tenga ciertos conocimientos básicos del front-end y esté familiarizado con ejemplos y códigos relevantes, podrá dominarlo rápidamente. El funcionario también proporciona documentación de desarrollo muy detallada, que es muy adecuada para que los desarrolladores aprendan. Puedes consultarlos. También hay materiales y tutoriales relevantes en línea. Si estás interesado, puedes buscarlo. Espero que el contenido compartido arriba sea correcto.