Mapa cortado cuando cambio la orientación del celular. #92

mauricioLopezRamirez · 2018-06-13T21:03:31Z

risinghero · 2018-06-14T08:14:04Z

Hi @mauricioLopezRamirez. Unfortunately I understand Spanish only with Google translate. But I hope that you understand English. Add orientation cordova plugin. Subscribe to orientation change event and recreate map. Like this (I haven't tested):
screen.orientation.addEventListener('change', function(){ Mapbox.hide(); Mapbox.show(yourOptions); });

mauricioLopezRamirez · 2018-06-14T13:54:55Z

@risinghero gracias por tu respuesta, lo e hecho sin plugin, solo utilice javascript lo cual detecta el cambio de orientación pero no ha funcionado el siguiente código. Que otra opción propones:

  window.addEventListener("orientationchange", function() {

Mapbox.hide();
showMap();

});

risinghero · 2018-06-14T15:12:06Z

@mauricioLopezRamirez please check with debugger that event "orientationchange" works. There can be some problems with it.

mauricioLopezRamirez · 2018-06-14T15:36:18Z

@risinghero si funciona, e puesto un alert para que me verifique que si se cambio de orientación y si cambia.

risinghero · 2018-06-14T15:44:58Z

@mauricioLopezRamirez to further help you I need simple example reproducing this issue. Can you create one? Just Map+subscription to event so i can test it on my pc.

mauricioLopezRamirez · 2018-06-14T15:51:45Z

ok @risinghero este es mi codigo del index.html

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width">
    <script type="text/javascript" src="cordova.js"></script>
   

  </head>
  <body onload="onLoad()">

  
<script>
  function onLoad() {

     document.addEventListener("deviceready", onDeviceReady, false);

 }

 function onDeviceReady() {
    showMap();
 }


  var zoom = 12;


  function setTilt() {
    Mapbox.setTilt({
      pitch: 45,
      duration: 4500
    });
  }


 window.addEventListener("orientationchange", function() {

Mapbox.hide();
showMap();

});

  function showMap() {

    Mapbox.show({
              style: 'emerald',
              margins: {
                'left': 0,
                'right': 0,
                'top': 0,
                'bottom': 0
              },
              center: {
                
                lat: 3.4210196,
                lng: -76.5201787
              },
              zoomLevel: zoom, // 0 (the entire world) to 20, default 10
              showUserLocation: true, // default false
              hideAttribution: true, // default false
              hideLogo: true, // default false
              hideCompass: false, // default false
              disableRotation: false, // default false
              disableScroll: false, // default false
              disableTilt: false, // default false
              disableZoom: false, // default false
              disablePitch: false, // default false
              markers: [
                {  
                  'lat': 3.4356455,
                  'lng': -76.5281464,
                  'title': 'CALLE 13 CON CARRERA 23',
                  'subtitle': 'Sentido: SUR-NORTE\nZona: CENTRO'
                }
              ]
            },
            function (result) {
              console.log(JSON.stringify(result));
              // let's add a callback for these markers - invoked when the callout is tapped (Android) or the (i) icon in the marker callout (iOS)
              Mapbox.addMarkerCallback(function (selectedMarker) {
               // alert("Marker selected: " + JSON.stringify(selectedMarker));
              });
              // let's add callbacks for region changing
              //
              // - invoked when the map is about to moved (animated or not).
              Mapbox.onRegionWillChange(function(centerCoordinates) {
                console.log("Map will move from: ", centerCoordinates);
              });
              // - invoked at each tick (so 60 per second) when the map moves. So don't do any heavy computing here.
              Mapbox.onRegionIsChanging(function(centerCoordinates){
                console.log("New map center is: ", centerCoordinates);
              });
              // - invoked after the map has moved (animated or not).
              Mapbox.onRegionDidChange(function(centerCoordinates) {
                console.log("Map as finished to move to : ", centerCoordinates);
              });
            },
            function (error) {
              alert(error);
            }
    )
  }

</script>

  </body>
</html>

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Mapa cortado cuando cambio la orientación del celular. #92

Mapa cortado cuando cambio la orientación del celular. #92

mauricioLopezRamirez commented Jun 13, 2018

risinghero commented Jun 14, 2018

mauricioLopezRamirez commented Jun 14, 2018 •

edited

Loading

risinghero commented Jun 14, 2018

mauricioLopezRamirez commented Jun 14, 2018

risinghero commented Jun 14, 2018

mauricioLopezRamirez commented Jun 14, 2018 •

edited

Loading

Mapa cortado cuando cambio la orientación del celular. #92

Mapa cortado cuando cambio la orientación del celular. #92

Comments

mauricioLopezRamirez commented Jun 13, 2018

risinghero commented Jun 14, 2018

mauricioLopezRamirez commented Jun 14, 2018 • edited Loading

risinghero commented Jun 14, 2018

mauricioLopezRamirez commented Jun 14, 2018

risinghero commented Jun 14, 2018

mauricioLopezRamirez commented Jun 14, 2018 • edited Loading

mauricioLopezRamirez commented Jun 14, 2018 •

edited

Loading

mauricioLopezRamirez commented Jun 14, 2018 •

edited

Loading