Capítulo 3 - Explicación

 

Previamente… Módulo 8 - Capítulo 2


Preparación de contenido


Ahora ya tienes tu propia aplicación para el dispositivo virtual. Sin embargo, tienes que crear contenido.


Para esto puedes usar el editor online llamado codesandbox.io


Selecciona “Create a sandbox” y lo mismo en la siguiente ventana.



Choose Static version and proceed to a new window.

 

En la parte izquierda puedes encontrar el explorador de archivos, en la parte central está el código y en la derecha hay un visor para previsualizar tus productos.

Selecciona el icono del cubo en la parte izquierda y cambia la descripción


 

 


Después copia el Código del Paso 3 y pégalo en la sección de código


No debería quedar nada del código antiguo, solo el nuevo que acabas de copiar




Paso 3:

<!DOCTYPE html>
<html lang="en">

<head>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.2.1/css/ol.css"
type="text/css"
/>
<style>
.map {
height: 400px;
width: 100%;
}
</style>
<script src="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.2.1/build/ol.js"></script>
<title>OpenLayers example</title>
</head>
<body>
<div id="map" class="map"></div>

<script type="text/javascript">
var map = new ol.Map({
target: "map",
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
})
],
view: new ol.View({
center: ol.proj.fromLonLat([7.52, 46.4]),
zoom: 9
})
});
</script>
</body>
</html>




Guarda el archive y mira que el contenido- openstreetmap aparece en el visor


Encima del mapa, hay un link.


Puedes copiarlo y abrirlo en una nueva ventana



Ahora copia el link y pégalo en el Android Studio en el mainActivity.java code donde hasta ahora estaba la dirección mygeoproject.eu


                           Después corre la aplicación en el dispositivo virtual de nuevo.



Igual tienes que encender el dispositivo.


Ahora puedes ver el openstreetmap en tu dispositivo.




Continua… Módulo 8 – Capítulo 4




Última modificación: Tuesday, 25 de July de 2023, 10:03