Gmap3 - Forum

Gmap3 exchange platform

You are not logged in.

Ads
(server costs 27.50€ per month)


#1 2012-10-16 19:34:43

bobbeamon
Member
Registered: 2012-10-16
Posts: 3

Link in InfoWindow problem on mobile device

Hi,

My map work very well on computers (pc/mac, every browsers) but I've got a problem on mobile devices (android/iphone).

When I select a marker, the InfoWindow is well displayed, but the link is unclickable.
I can select a link how many times I wan't, I can't access the linked pages.

Anyone have experienced this problem and anyone has a solution to my problem ?

If you wanna try: http://booksgeo.com

Here's my code:

Map initialisation

$('#books-map').gmap3(
    {action: 'init',
    options:{
    center:[36.175729019533996, -13.061332250000078],
    zoom:defaultZoom,
    maxZoom:18,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    mapTypeControl: true,
    mapTypeControlOptions: {
    style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
    },
    navigationControl: true,
    scrollwheel: true,
    streetViewControl: false
    },
      events: {zoom_changed: function(map) {
        if (map.getZoom() < defaultZoom) { map.setZoom(defaultZoom); }
      }
    }
  },"autofit");

The map (after getJSON) :

          var data1 = [];
         
          $.each(data, function(index, array) {
            var markerIcon;
            if (array.total > 1) {
              markerIcon = new google.maps.MarkerImage("icon_green.png");
            } else {
              markerIcon = new google.maps.MarkerImage("marker.png");
            }  
                          
            data1.push({
            lat: array.lat,
            lng: array.lng,
            tag: array.sub_admin_code,
            data: getInfoWindow(array),
            options: {icon:markerIcon},
            data1: array
            });
          });
          
          if (data1.length !== 0) {
              $('#books-map').gmap3({
                    action: 'setCenter', 
                    args:[itemLatLng]
               },{
                    action: 'setZoom', 
                    args:[zoom]
               }
               );
          } else {
        	  $('#no_result').val('Oops');
          }
          
          $('#books-map').gmap3(
            {action:'clear'},
            {action:'clear', name:'marker'},
            {
                action:'addMarkers',
                radius:10,
                markers: data1,
                clusters:{
                  0: {
                  content: '<img src="marker.png"/>',
                  width: 23,
                  height: 22
                  },
                  1: {
                  content: '<img src="icon_green.png"/>',
                  width: 23,
                  height: 22
                  }
                },
                cluster:{
                  events:{
                    click: function(cluster, event, data){
                      $(this).gmap3(
                        { action:'clear', name:'infowindow'},
                        { action:'addInfoWindow',
                          latLng: data.latLng,
                          content:  getInfoWindowCluster(data.latLng),
                          offset: {
                          x:-46,
                          y:-70
                          }
                        }
                        );
                      
                      var map = $(this).gmap3('get'),
                      infowindow = $(this).gmap3({action:'get', name:'infowindow'});
                      google.maps.event.addListener(map, 'zoom_changed', function() { infowindow.close() });
                    }
                }},
                marker:{
                  options:{
                    draggable: false
                  },
                  events:{
                    click: function(marker, event, data){
                      var map = $(this).gmap3('get'),
                      infowindow = $(this).gmap3({action:'get', name:'infowindow'});
                      if (infowindow){
                        infowindow.open(map, marker);
                        infowindow.setContent(data);
                      } else {
                        $(this).gmap3({action:'addinfowindow', anchor:marker, options:{content: data}});
                      }
                    }
                  }
                }
            }
            );

The InfoWindows:

function getInfoWindowCluster(latLng) {
    var parameters = getLatLngMinMaxParameters(latLng);
    
    return "<div><a href='?page_id=16&minLat="+parameters.minLat+"&maxLat="+parameters.maxLat+"&minLng="+parameters.minLng+"&maxLng="+parameters.maxLng+"'>My link<br/>(d&eacute;tail)</a></div>";
  } 
  
  function getInfoWindow(array) {
    if (array.total > 1) {
      return "<div><a href='?page_id=16&lat="+array.lat+"&lng="+array.lng+"'>My link<br/>(d&eacute;tail)</a></div>";
    } else {
      return "<div><a href='?p="+array.id+"'><b>"+array.post_title+"</b> de "+array.name+"</a></div>";
    }
  }

Offline

Ads
(server costs 27.50€ per month)


Board footer

Powered by FluxBB