[lemorlenny]

I place a map widgets inside a panel then a button with the function calling: DrawPath().

code snippet:

var Map=null;

// ************************************
phoneui.documentReadyHandler = function() {
  $(window).load(function () {
    initMap();
  });
}

// ************************************
function initMap() {

  $('[id$=map1]').gmapready(function(gmap) {
    Map=gmap;

    var latlng = new google.maps.LatLng(-34.397, 150.644);
    
    var myOptions = {
          zoom: 13,
          center: latlng,
          mapTypeControl: true,
          streetViewControl: false,
          mapTypeId: google.maps.MapTypeId.ROADMAP
    };
  });
}

// ************************************
function DrawPath() {

  var directions = null;
  var directionsDisplay = null;
  var directionsService = null;

  var start = "";
  var end = "";

  directionsDisplay = new google.maps.DirectionsRenderer();
  directionsDisplay.setMap(Map);

  if (navigator.geolocation){
    navigator.geolocation.getCurrentPosition(showPosition)
  };
      
  // *******************
  function showPosition(position){
    start = (position.coords.latitude+','+position.coords.longitude)
    end = (EndPosition);    // target coordinates

    Map.setCenter(new google.maps.LatLng(start),8); // set current position
      
    var directionsRequest = {
        origin:start,
        destination:end,
        travelMode: google.maps.DirectionsTravelMode.DRIVING,
        unitSystem: google.maps.UnitSystem.METRIC
    };
  
    directionsService = new google.maps.DirectionsService();
    
    directionsService.route(
      directionsRequest,
      function(response, status)
      {
        if (status == google.maps.DirectionsStatus.OK)
        {
          new google.maps.DirectionsRenderer({
            map: Map,
            directions: response
          });
        }
        else
          alert("Can't find path");
      }
    );

    google.maps.event.trigger(Map, "resize");
  }
}

The first calling I make all working fine, the path will drawing.
If I come back and calling newly the same path or another the map broke everytime:

See attachment IMG_3626_3.jpg

Sometimes the map still in a little corner also with the rest in gray color.

I tried some solution without success, some suggestions?

Many thanks in advance.

Attachments:

You must be logged in to view attached files.

[Brandon]

It looks like a problem with the map reinitializing, this is something support will have to check out I think.

[lemorlenny]

@CincyPlanet wrote:

It looks like a problem with the map reinitializing, this is something support will have to check out I think.

Thanks for your reply,
now I initialize the map only at the first start but I had the the same problem using reinitialization in every call (I believe) using the syntax:

......
  $('[id$=map1]').gmapready(function(gmap) {
    directionsDisplay = new google.maps.DirectionsRenderer();
    directionsDisplay.setMap(gmap);
......

maybe is needed to ‘nullify’ the map at every call you think?

Regards.

[Brandon]

You could try that when you go back to the screen set it to null and reset it and see if that works. I know they had a problem similar to this with multipage widgets at one time, not sure if its the same thing but its possible.

[lemorlenny]

@CincyPlanet wrote:

You could try that when you go back to the screen set it to null and reset it and see if that works. I know they had a problem similar to this with multipage widgets at one time, not sure if its the same thing but its possible.

I believe to have found the problem, the instruction:

Map.setCenter(new google.maps.LatLng(start),8); // set current position

create a new map object which overlay the previous, if I replace this line with:

var LocalPos = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
Map.setCenter(LocalPos);

all work fine.

Regards.

[Author]

Posts