2 Replies Latest reply on Aug 20, 2016 5:18 PM by leonchas

    I do not appear when I copilo map and test on android device

    leonchas

      Good afternoon I have a problem with my project the question is that when I run my code geolocalizacion in my web browser works fine but when copilo and I test on my Android phone stays charged and does not exceed ayi not know if someone could me help or explain that I 'm doing wrong I would greatly appreciate this is my code

       

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

      <html xmlns="http://www.w3.org/1999/xhtml">

      <head>

      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

      <title>Localizacion</title>

      <meta HTTP-EQUIV="Content-Type" content="text/html; charset=iso-8859-1" />

              <script type="text/javascript" src="cordova.js"></script>

              <script src="phonegap.js"></script>

              <link rel="stylesheet" href="../JQ/jquery.mobile-1.4.2.min.css" />

        <script src="../JQ/jquery-2.1.1.min.js"></script>

        <script src="../JQ/jquery.mobile-1.4.2.min.js"></script>

              <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>

              <script src="../JS/GoogleMaps.js"></script>

              <link rel="stylesheet" href="../CSS/index.css" />

              <script>

        document.addEventListener("deviceready",inicio);

              window.addEventListener("load",inicio);

        $(function() {

        $("#guardardatos").click(function() {

        var fNombre = $("#Nombre").val();

          var fDescripcion = $("#Descripcion").val();

          var fLatY = $("#LatY").val();

        var fLongX = $("#LongX").val();

       

        $("#Nombre").val(" ");

          $("#Descripcion").val(" ");

          $("#LatY").val(" ");

        $("#LongX").val(" ");

       

        $.ajax({type: "POST",

        url: "http://localhost/agregar.php",

                            data: ({Nombre: fNombre, Descripcion: fDescripcion, LatY: fLatY, LongX: fLongX}),

                            cache: false,

                            dataType: "text",

                            success: Enviamos

                          });

       

        });

       

        function Enviamos(data){    

        alert(data+"Reporte enviado");

        $.mobile.changePage( "#page3", { transition: "slideup", role:"dialog"});

        }

       

        });

        </script>

              <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBn0OkmG3BWTTMwyxljAHjeaivCB85P8JI&signed _in=true&callback=initMap"

              async defer>

          </script>

      </head>

       

       

      <body>

      <div data-role="page" id="paginaMapa" data-url="map-page">     

              <div data-role="header">

                  <h1>Tu posicion es:</h1>

                  </div>

               

                  <div id="map-canvas"></div>

                   

                  <a href="#page2" id="manda" class="miBoton posicionBoton" ></a>

              </div><!---FIN PAGINA MAPA--->

       

       

      My Javascrip

       

      // JavaScript Document

       

       

        $( document ).on( "pageinit", "#paginaMapa", "#page2", function(e,data) {

       

       

       

        var defaultPos = new google.maps.LatLng(19.289168,-99.653440);

       

        if (navigator.geolocation) {

                       function exito(pos) {

                            MuestraMapa(new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude));

       

       

                          }

        function falla(error) {

        //si falla mostrar mpara en posicion por defecto

        alert('Error en servicio Geolocalizador');

        MuestraMapa(defaultPos);

        }

       

        //maximumAge- Guarda la posicion por 5 minutos

        //enableHighAccuracy: Se tratan de obtener los mejores resultados posible del GPS

        //timeout: el tiempo maximo que se espera para obtener la posicion en este caso 5 segundos

        var options = {maximumAge: 500000, enableHighAccuracy:true, timeout: 5000};

        navigator.geolocation.getCurrentPosition(exito, falla, options );

        }//FIN IF

        else {

                          MuestraMapa(defaultPos);  // No soporta geolocalizacion y dibuja el mapa en posicion Default

                      }

       

       

        //FUNCION DIBUJAR MAPa

        function MuestraMapa(latlng) {

        //Recuperar puntos

        var capa = String(latlng);

        var res = capa.replace(/\(|\)/g, '');//Quitar los parentesis

        var latitud=  res.substring(0, res.indexOf(','));

        var longitud=  res.substring(res.indexOf(",") + 2);

        $('#LatY').val(latitud);

        $('#LongX').val(longitud);

       

        var myOptions = {

                              zoom: 16,

                              center: latlng,

        disableDefaultUI: true,

                              mapTypeId: google.maps.MapTypeId.ROADMAP};

       

        var map = new google.maps.Map(document.getElementById("map-canvas"), myOptions);

       

        var infowindow = new google.maps.InfoWindow({

                                        position: latlng,

                                        content: '<p>Tu posición actual</p>'+latlng

         });

       

        var marker = new google.maps.Marker({

        position: latlng,

        map: map,

        title: "Mi posición",

        animation: google.maps.Animation.DROP

                          });

        google.maps.event.addListener(marker, 'click', function() {infowindow.open(map,marker);});

       

        }// Fin muestra mapa

       

        });

       

      and this is my config file is where I feel I'm wrong but no idea

       

      <?xml version="1.0" encoding="UTF-8" ?>

      <widget xmlns = "http://www.w3.org/ns/widgets"

          xmlns:gap = "http://phonegap.com/ns/1.0"

          id        = "com.phonegap.example"

          version   = "1.0.0">

       

       

       

      <name>PhoneGap Build Application</name>

       

       

      <description>

      A simple PhoneGap Build application.

      </description>

       

       

      <author href="https://example.com" email="you@example.com">

      Your Name

      </author>

          <!--

            This allows your app to load assets from all *.phongap.com domains

      -->

       

      <access origin="*" />

      <preference name="phonegap-version" value="cli-6.3.0" />

      <plugin name="org.apache.cordova.geolocation" spec="0.3.12" source="pgb" />

      <plugin name="com.yongsun.cordova.geolocation" spec="0.3.12" source="pgb" />

      <feature name="Geolocation">

          <param name="android-package" value="org.apache.cordova.GeoBroker" />

      </feature>

      </widget>

       

       

      We appreciate all the help you could provide me

        • 1. Re: I do not appear when I copilo map and test on android device
          VectorP Level 4

          Sorry, but....what a mess!

           

          Here are the most important suggestions:

           

          1. You have

          <script type="text/javascript" src="cordova.js"></script>

            <script src="phonegap.js"></script>

          Remove the latter. You can't have both.

           

          2. If the html code is in your index.html, you can't have

          <script src="../JS/GoogleMaps.js"></script> (etc)

          since that would be one level above your project root.

           

          3. You have

            document.addEventListener("deviceready",inicio);

                  window.addEventListener("load",inicio);

          Do you want that function to be executed twice? And where is the function defined?

           

          4. In your config, icons and splashes are missing. If you include them, don't forget to specifiy the splashscreen plugin from npm.

          Also, you don't have the required Google libraries whitelisted, because both the whitelist plugin and the allow-navigation rules are missing.

           

          5. In your config:

          - remove the feature element

          - remove both mentioned plugins, because they are deprecated

          - add the Geolocation plugin from npm

          • 2. Re: I do not appear when I copilo map and test on android device
            leonchas Level 1

            This is my js but when I try it does not draw me a map error geolocalizacion send me someone could help me with this problem?

             

            <script src="../JS/GoogleMaps.js"></script>

             

            // JavaScript Document

             

             

              $( document ).on( "pageinit", "#paginaMapa", "#page2", function(e,data) {

             

             

             

              var defaultPos = new google.maps.LatLng(19.289168,-99.653440);

             

              if (navigator.geolocation) {

                             function exito(pos) {

                                  MuestraMapa(new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude));

             

             

                                }

              function falla(error) {

              //si falla mostrar mpara en posicion por defecto

              alert('Error en servicio Geolocalizador');

              MuestraMapa(defaultPos);

              }

             

              //maximumAge- Guarda la posicion por 5 minutos

              //enableHighAccuracy: Se tratan de obtener los mejores resultados posible del GPS

              //timeout: el tiempo maximo que se espera para obtener la posicion en este caso 5 segundos

              var options = {maximumAge: 500000, enableHighAccuracy:true, timeout: 5000};

              navigator.geolocation.getCurrentPosition(exito, falla, options );

              }//FIN IF

              else {

                                MuestraMapa(defaultPos);  // No soporta geolocalizacion y dibuja el mapa en posicion Default

                            }

             

              

              //FUNCION DIBUJAR MAPa

              function MuestraMapa(latlng) {

              //Recuperar puntos

              var capa = String(latlng);

              var res = capa.replace(/\(|\)/g, '');//Quitar los parentesis

              var latitud=  res.substring(0, res.indexOf(','));

              var longitud=  res.substring(res.indexOf(",") + 2);

              $('#LatY').val(latitud);

              $('#LongX').val(longitud);

             

              var myOptions = {

                                    zoom: 16,

                                    center: latlng,

              disableDefaultUI: true,

                                    mapTypeId: google.maps.MapTypeId.ROADMAP};

             

              var map = new google.maps.Map(document.getElementById("map-canvas"), myOptions);

             

              var infowindow = new google.maps.InfoWindow({

                                              position: latlng,

                                              content: '<p>Tu posición actual</p>'+latlng

               });

             

              var marker = new google.maps.Marker({

              position: latlng,

              map: map,

              title: "Mi posición",

              animation: google.maps.Animation.DROP

                                });

              google.maps.event.addListener(marker, 'click', function() {infowindow.open(map,marker);});

              

              }// Fin muestra mapa

             

              });