Forum CMS Made Simple FR
[Résolu] La géolocalisation a échouée... CGGoogleMap - Version imprimable

+- Forum CMS Made Simple FR (https://forum.cmsmadesimple.fr)
+-- Forum : Général (https://forum.cmsmadesimple.fr/forum-3.html)
+--- Forum : Modules, Tags (https://forum.cmsmadesimple.fr/forum-14.html)
+--- Sujet : [Résolu] La géolocalisation a échouée... CGGoogleMap (/thread-3130.html)

Pages : 1 2

[Résolu] La géolocalisation a échouée... CGGoogleMap - snatch1974 - 01/03/2014

Citation :#~~~~~ DEBUT BLOC A NE PAS SUPPRIMER ~~~~~
#~ Version du CMS: 1.11.10
#~ Url du site : www.af2s.com
#~ Hébergeur / Soft : ovh
#~ Informations Système :
#~ ----------------------------------------------
#~ Cms Version: 1.11.10
#~ Installed Modules:
#~ CMSMailer: 5.2.2
#~ CMSPrinting: 1.0.5
#~ FileManager: 1.4.3
#~ MenuManager: 1.8.6
#~ MicroTiny: 1.2.5
#~ ModuleManager: 1.5.5
#~ News: 2.14.1
#~ Search: 1.7.11
#~ ThemeManager: 1.1.8
#~ TinyMCE: 2.9.12
#~ Gallery: 1.6.1
#~ AjaxMadeSimple: 0.4.0
#~ CGExtensions: 1.38.1
#~ CGSimpleSmarty: 1.7.1
#~ CGSmartImage: 1.15
#~ FrontEndUsers: 1.22.3
#~ JQueryTools: 1.2.5
#~ TNMS: 1.1.7
#~ CGGoogleMaps: 2.4.7
#~ CGCalendar: 1.13.3
#~ DownloadManager: 1.5.3
#~ ListIt2: 1.4.1
#~ ListIt2Communiques: 1.4
#~ FormBuilder: 0.7.4
#~ Config Information:
#~ php_memory_limit: 128M
#~ process_whole_template: false
#~ max_upload_size: 64000000
#~ url_rewriting: mod_rewrite
#~ page_extension: .html
#~ query_var: page
#~ image_manipulation_prog: GD
#~ auto_alias_content: true
#~ locale: fr_FR.utf8
#~ default_encoding: utf-8
#~ admin_encoding: utf-8
#~ set_names: true
#~ Php Information:
#~ phpversion: 5.5.7
#~ md5_function: On (Vrai)
#~ gd_version: 2
#~ tempnam_function: On (Vrai)
#~ magic_quotes_runtime: Off (Faux)
#~ E_STRICT: 2048
#~ E_DEPRECATED: 8192
#~ memory_limit: 128M
#~ max_execution_time: 120
#~ output_buffering: 4096
#~ safe_mode: Off (Faux)
#~ file_uploads: On (Vrai)
#~ post_max_size: 64M
#~ upload_max_filesize: 64M
#~ session_save_path: /tmp (1777)
#~ session_use_cookies: On (Vrai)
#~ xml_function: On (Vrai)
#~ xmlreader_class: On (Vrai)
#~ Server Information:
#~ Server Api: fpm-fcgi
#~ Server Db Type: MySQL (mysqli)
#~ Server Db Version: 5.1.66
#~ Server Db Grants: Impossible de trouver un privilège "GRANT ALL". Cela peut signifier que vous pourriez avoir des problèmes pour installer ou retirer des modules, ou encore l 'ajout et la suppression d'éléments, y compris les pages.
#~ Server Time Diff: Date du système de fichiers différent du serveur
#~ ----------------------------------------------
#~~~~~ FIN BLOC A NE PAS SUPPRIMER ~~~~~



Bonjour à tous,

D'un coup, ma carte googlemap n'affiche plus aucun point et je me retrouve avec ce message d'erreur pour chacun des points:

La géolocalisation (adresse en coordonnées lat/long) a échouée pour *** ; vérifiez les données de géolocalisation

Je n'utilise pas la géolocalisation par coordonnées, mais seulement par adresse.
Ca a bien fonctionné un temps et d'un coup... problème!

Est-ce que quelqu'un a déjà été confronté à ce problème?

Merci

[Résolu] La géolocalisation a échouée... CGGoogleMap - jissey - 01/03/2014

Bonjour,
lest-ce que tu as fait une mise à jour du cms ou d'un des modules CG (CGExtensions etc)?
Malgré les message la carte s'affiche et les points semblent bien localisés.
As-tu essayé de mettre des points GPS?

Longue vie à la jeune FS2S Smile

[Résolu] La géolocalisation a échouée... CGGoogleMap - Jean le Chauve - 01/03/2014

Quelle page ? Car dans "stations", je vois le message d'erreur, mais également les icônes qui sont affichées dans la carte.
Peut-être Google te bloque car tu en as de trop (tu n'as droit qu'à un certain nombre par mois (version non payante), j'avais eu ce problème il y 2 ans). Ma solution avait été d'utiliser les coordonnées lat et lon (que tu peux trouver dans la table (BD) du module puisque ça fonctionnait avant).

[Résolu] La géolocalisation a échouée... CGGoogleMap - jissey - 01/03/2014

Tiens!
Salut Monseigneur le Comte du domaine de .be!
Sais-tu pourquoi il existe une autre version CGGooglemaps2 du même auteur?

[Résolu] La géolocalisation a échouée... CGGoogleMap - jissey - 01/03/2014

j'ai ma réponse, c'est marqué dans l'aide :
Robert a écrit :Differences between CGGoogleMaps and CGGoogleMaps2

There are a few important differences between the two modules that you should take note of:

Width and Height Inputs removed

For the most part, styling is now done with the various templates, and in your CMSMS stylesheets. For that reason, the width and height, and any other styling related input fields have been removed from the map form.
Categories Removed

Categories were a seldom used feature that are different for each implementation. The CGGoogleMaps2 removes the inflexible category mechanism in exchange for providing flexibility in the jquery plugin provided.
Sidebar Removed

The sidebar a seldom used feature that are different for each implementation. The CGGoogleMaps2 removes the inflexible category mechanism in exchange for providing flexibility in the jquery plugin provided.

Users developing applications centered around a map can modify the map template of their map to quite easily add a sidebar.
Numerous Templates Removed.

Most of the templates thatusers never modified in CGGoogleMaps were removed. The javascript template was merged into the map template, and because of the provided jquery plugint he code is much simpler in there.
Updates for the revised GoogleMaps API.

The google maps api continues to evolve. The GoogleMaps2 module takes advantage of the latest version of the API as of this writing.
Allows for ajax based map generation.

This module makes it easy for anyone with javascript and CMSMS experience to build an ajax based map (where the markers are retrieved via ajax). Simply bind to the "cggm2idle" event. or set the "idle_cb" option into the object to a function.

Ca ne résout pas ton problème mais tu peux toujours tester cette version.

[Résolu] La géolocalisation a échouée... CGGoogleMap - snatch1974 - 01/03/2014

Merci à tous pour réponses.

- J'ai fait une mise à jour de tout mais le problème se présentait déjà avant la mise à jour donc, ça ne vient pas de là.

- C'est bien la page "stations", mais moi, sur la carte, je n'ai aucun point qui s'affiche, elle reste vierge avec les messages d'erreur à coté. J'ai vérifié justement dans la BD si des lat et long étaient mises car dans l'aide j'ai vu que si les coordonnées lat/long existaient, ils devenaient prioritaires donc, j'ai pensé à un conflit entre adresse et coordonnées, mais à priori, c'est pas ça.
Je vais tester cet après-midi en enlevant des points pour voir si c'est un problème de trop de points.

- Je vais aussi essayer de tester le cggooglemap2 pour voir si le problème persiste et pt'être que la nouvelle version sera plus simple aussi à personnaliser si ça passe désormais par le css et jquery.


Je vous tiens donc au jus dans la soirée...

[Résolu] La géolocalisation a échouée... CGGoogleMap - jissey - 01/03/2014

j'ai installé la version 2, je n'ai pas de problème avec 2 points.
Par contre je remarque que si je n'utilise pas le cache du module, au bout de quelques affichages (requêtes chez notre ami GG), les points disparaissent.
Il parait donc évident que GG restreigne les accès trop fréquents, reste à vérifier s'il fait de même pour les accès trop nombreux.

Tu devrais donc aussi voir au niveau du module, onglet préférences, choisir "Consulter d'abord le cache".

[Résolu] La géolocalisation a échouée... CGGoogleMap - snatch1974 - 01/03/2014

j'ai déjà paramétré le cache et ça n'y change rien

[Résolu] La géolocalisation a échouée... CGGoogleMap - Jean le Chauve - 01/03/2014

Pourquoi n'essaie-tu pas de mettre les coordonnées en lat et en lon comme proposé plus haut, tu pourrais ainsi découvrir si l'erreur provient de là ?
Tu n'es pas le seul à avoir cette erreur, fais une recherche sur le message d'erreur.
Je ne vois plus tes icônes, maintenant.
La carte est décalée sur ma résolution de 1920*1080 et sort à droite.

Salut Jissey, on est sorti du lit en même temps :lol:

[Résolu] La géolocalisation a échouée... CGGoogleMap - snatch1974 - 01/03/2014

ça fait parti des tests que je vais faire par contre si c'est ça, ça ne résout pas vraiment le problème car les personnes qui vont s'en occuper et remplir petit à petit la base des stations, ils risquent d'en avoir vite marre d'aller chercher les coodonées gps au lieu de rentrer un simple code postale.

[Résolu] La géolocalisation a échouée... CGGoogleMap - snatch1974 - 02/03/2014

Bon, résultat:

les coordonnées en latitude / longitude fonctionne à merveille, donc, on va pas se faire chier plus longtemps et on va fonctionner comme ça, surtout que j'ai réussi à trier mes stations par ordre alphabétique... bref, ça me va très bien!

J'ai essayé le CGGooglemaps2... il ne reste quasiment aucun paramètre configurable donc, sans intérêt dans mon cas.


Par contre, autre question pour problème gênant:

Pourquoi les bulles n'affiches pas le nom de mes villes en entier bien que 250px de largeur soit paramétrer, ce qui est normalement plus que suffisant?
Il me fait une césure sur certains points seulement, avec un "overflow:hidden" qui me cache le reste du nom de la ville.

Merci pour votre aide sur la première question.

[Résolu] La géolocalisation a échouée... CGGoogleMap - Jean le Chauve - 02/03/2014

As-tu bien spécifié la hauteur des bulles d'info à 250 ?
Difficile de travailler sur un code non valide : http://validator.w3.org/check?uri=http%3A%2F%2Fwww.af2s.com%2Fstations.html&charset=%28detect+automatically%29&doctype=Inline&ss=1&group=0&verbose=1&user-agent=W3C_Validator%2F1.3+http%3A%2F%2Fvalidator.w3.org%2Fservices
Ne pas utiliser les commentaires html, mais bien les commentaires smarty {* ... *} car s'il y a des tirets dans le code commenté, le commentaire html risque de planter, ce qui est ton cas.

Essaye en balisant ton texte <h3> ou <p>, car je n'ai pas ton problème (version 2.3.1 cms 1.10.3)
ex: http://www.promojeunes-amo.be/ressources/annuaire-jeunesse/services-aide-jeunesse-milieu-ouvert-amo.html

Montre-nous ton gabarit javascript.

[Résolu] La géolocalisation a échouée... CGGoogleMap - snatch1974 - 02/03/2014

La hauteur des bulles d'info a bien été spécifié.

J'ai regardé la validation w3... j'ai corrigé les 2-3 conneries que j'avais fait, par contre, tout le reste provient de CgGooglemaps. J'ai pu corrigé certains trucs mais l'histoire des commentaires html, je n'ai pas trouvé où ils étaient générés.

J'ai mis mon texte entre balises comme préconisé et ça a résolu une partie du problème. Certaines stations continuent d'afficher les infobulles sur plusieurs lignes de façon incompréhensible.

Gabarit JS:

Code :
[== JavaScript ==]
{* javascript template *}
{if $mapinstance == 1}
<script type="text/javascript" {$map_defertxt}>{literal}//<![CDATA[
if( typeof(jQuery) == 'undefined' ){
  alert('JQuery is required for this map to function');
}
{/literal}{if $map->sensor}{literal}
var my_location;
jQuery(document).ready(function(){
// a function to determine the current browser location.
// this function is asynchronous in nature.
function getGeoLocation()
{
  if(navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position){
      // Try W3C Geolocation (Preferred)
      var tmp = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
      my_location = tmp.toString();
    });
  } else if (google.gears) {
    // Try Google Gears Geolocation
    var geo = google.gears.factory.create('beta.geolocation');
    geo.getCurrentPosition(function(position) {
      var tmp = new google.maps.LatLng(position.latitude,position.longitude);
      my_location = tmp.toString();
    });
  }
}
getGeoLocation();
});{/literal}{/if}
//]]></script>{/if}

{jsmin}<script type="text/javascript" {$map_defertxt}>{literal}
jQuery(document).ready(function(){{/literal}
{if $generator->get_marker_count()}{if $map->info_window}{literal}
function handle_info_window(marker)
{
  // setup the text for the info window
  var tmp = jQuery('#cggm_infowindow_'+marker.map_instance);
  jQuery(tmp).empty();
  jQuery('.cggm_infowindow',marker.jq).clone().appendTo(tmp);
  tmp.find('form').append('<input type="hidden" name="map_instance" value="'+marker.map_instance+'"/><input type="hidden" name="marker_alias" value="'+marker.alias+'"/>');
  tmp.find('.cggm_infowindow').attr('id','cggm_infowindow_'+marker.map_instance);
  infoWindow.setContent(tmp.html());
  infoWindow.open(mapObj,marker);

  // handle clicking on 'to here'
  jQuery('div#cggm_infowindow_'+marker.map_instance+' a.cggm_dir_to').click(function() {
    var tmp = jQuery(this).closest('div.cggm_infowindow').parent();
    var map_instance = tmp.find(":input[name='map_instance']").val();
    var marker_alias = tmp.find(":input[name='marker_alias']").val();
    var mkr = jQuery('#map_'+map_instance+'_marker_'+marker_alias).data('marker');
    jQuery(this).parent().find('a').show();
    jQuery(this).hide();
    tmp.find("span").show();
    var addr = mkr.getPosition().toString();
    tmp.find(":input[name='daddr']").val(addr);
    tmp.find('span.cggm_dirto').hide();
    tmp.find(":input[name='saddr']").val(my_location);
    tmp.find('form').show();
  });

  // handle clicking on from here.
  jQuery('div#cggm_infowindow_'+marker.map_instance+' a.cggm_dir_from').click(function() {
    var tmp = jQuery(this).closest('div.cggm_infowindow').parent();
    var map_instance = tmp.find(":input[name='map_instance']").val();
    var marker_alias = tmp.find(":input[name='marker_alias']").val();
    var mkr = jQuery('#map_'+map_instance+'_marker_'+marker_alias).data('marker');
    jQuery(this).parent().find('a').show();
    jQuery(this).hide();
    tmp.find("span").show();
    var addr = mkr.getPosition().toString();
    tmp.find(":input[name='saddr']").val(addr);
    tmp.find("span.cggm_dirfrom").hide();
    tmp.find(":input[name='daddr']").val(my_location);
    tmp.find('form').show();
  });

  {/literal}
  {if $map->directions_dest == 'PANEL'}
  {literal}
  // handle the submit button in the directions form.
  jQuery('div#cggm_infowindow_'+marker.map_instance+' form.cggm_directions_form').submit(function() {
    var tmp = jQuery(this).closest('div.cggm_infowindow').parent();
    var src = jQuery(":input[name='saddr']",tmp).val();
    var dest = jQuery(":input[name='daddr']",tmp).val();
    var req = {
       origin: src,
       destination: dest,
       travelMode: google.maps.DirectionsTravelMode.DRIVING
    };
    directionsService.route(req, function(response,status) {
      if( status == google.maps.DirectionsStatus.OK ) {
        directionsDisplay.setMap(mapObj);
        directionsDisplay.setPanel(document.getElementById('map_directions_'+mapInstance));
        directionsDisplay.setDirections(response);
        jQuery('#map_directions_'+mapInstance).show();
      }
    });
    return false;
  });
  {/literal}
  {/if}
  {literal}
}
{/literal}
{/if}
{/if}

// setup some variables and do initial testing.
var mapInstance = '{$mapinstance}';
var mapMainDiv = '#cggm_map_defn_'+mapInstance;
var mapElem = jQuery('#cggm_map_display_{$mapinstance}').get(0);
{literal}
if( mapElem == 'undefined' || mapElem == null ) {
  alert('{/literal}{$msg_mapelem_notfound}{literal}');
  return;
}{/literal}

{if $map->category_panel}
{if isset($categories)}
var category_info = new Array();
{foreach from=$map_categories item=cat}
category_info['{$cat.name}'] = '{$cat.icon}';
{/foreach}
{/if}
{literal}
// handle category form click
jQuery('#cggm_map_defn_'+mapInstance+' form.category_form :checkbox.category_checkbox').click(function(){
  // hide the infowindow
  infoWindow.close();
  // for each checkbox
  var cats = new Array();
  jQuery('#cggm_map_defn_'+mapInstance+' form.category_form :checkbox.category_checkbox:checked').each(function(){
    // add it to the list.
    cats.push(jQuery(this).attr('name'));
  });

  // for each marker
  jQuery('#cggm_map_defn_'+mapInstance+' div.cggm_map_markers > div.cggm_marker').each(function(){
    // get the categories
    var mname = jQuery(":input[name='name']",this).val();
    var tmp = jQuery(":input[name='categories']",this).val().split(',');
    var meta = jQuery(":input[name='meta']",this).val();
    // check for visible categories
    var display = false;
    var firstcat = '';
    for( i = 0; i < cats.length; i++ )
    {
       if( jQuery.inArray(cats[i],tmp) != -1)
       {
          display = true;
          firstcat = cats[i];
          break;
       }
    }
    // toggle the marker
    var mkr = jQuery(this).data('marker');
    mkr.setVisible(display);
    if( !meta )
    {
      var ticon = category_info[firstcat];
      mkr.setIcon(icons[ticon]);
    }

    // for each marker info window item in this marker
    jQuery('.cggm_infowindow_item',this).each(function(){
       var tmp = jQuery(":hidden[name='categories']",this).val();
       if( typeof tmp != 'undefined' ) {
         tmp = tmp.split(',');
         display = false;
         for( i = 0; i < cats.length; i++ )
         {
            if( jQuery.inArray(cats[i],tmp) != -1)
            {
              display = true;
              break;
            }
         }
         if( display )
         {
            jQuery(this).show();
         }
         else
         {
            jQuery(this).hide();
         }
       }
    });
  });

  // foreach sidebar item
  jQuery('#cggm_map_defn_'+mapInstance+' li.cggm_sidebar_item').each(function(){
    // toggle the sidebar item
    var tmp = jQuery(":hidden[name='categories']",this).val().split(',');
    var display = false;
    for( i = 0; i < cats.length; i++ )
    {
       if( jQuery.inArray(cats[i],tmp) != -1)
       {
          display = true;
          break;
       }
    }
    if( display )
    {
       jQuery(this).show();
    }
    else
    {
       jQuery(this).hide();
    }
  });
});
{/literal}
{/if}

// build the map itself.
var map_options = {ldelim}
mapTypeId: google.maps.MapTypeId.{$generator->get_google_maptype()},
{if $map->nav_controls}
navigationControl: true,
navigationControlOptions: {ldelim}style: google.maps.NavigationControlStyle.{$map->nav_control_option}{rdelim},
{else}
navigationControl: false,
{/if}
{if $map->scale_controls}
scaleControl: true,
{else}
scaleControl: false,
{/if}
{if $map->sv_controls}
streetViewControl: true,
{else}
streetViewControl: false,
{/if}
{if $map->type_controls}
mapTypeControl: true,
mapTypeControlOptions: {ldelim}style: google.maps.MapTypeControlStyle.{$map->type_control_option},position: google.maps.ControlPosition.TOP_LEFT{rdelim},
{else}
mapTypeControl: false,
{/if}
{if $map->center_lat != '' && $map->center_lon != ''}
// center latitude and longitude set for the map
center: new google.maps.LatLng({$map->center_lat},{$map->center_lon}),
{else}
// center latitude and longitude calculated by markers.
center: new google.maps.LatLng({$generator->get_center_lat()},{$generator->get_center_lon()}),
{/if}
zoom: {$map->zoom}
{rdelim}; // map_options

var mapObj = new google.maps.Map(mapElem,map_options);
var infoWindow = new google.maps.InfoWindow();
{if $map->zoom_encompass && $generator->get_marker_count() > 1}
  // set zoom encompass
  var minll = new google.maps.LatLng({$generator->get_min_lat()},{$generator->get_min_lon()});
  var maxll = new google.maps.LatLng({$generator->get_max_lat()},{$generator->get_max_lon()});
  var bds = new google.maps.LatLngBounds(minll,maxll);
  mapObj.fitBounds(bds);
{/if}
{if $map->directions && $generator->get_marker_count()}
var directionsService = new google.maps.DirectionsService();
var directionsDisplay = new google.maps.DirectionsRenderer();
{/if}

{if $map->sv_controls}
{* build the streetview panorama object *}
panorama = new  google.maps.StreetViewPanorama(document.getElementById('cggm_sv_display_'+mapInstance));
mapObj.setStreetView(panorama);
{/if}
{if isset($icons)}
// build the icons.
var icons = new Array();
{foreach from=$icons item='icon'}
icons['{$icon.name}'] = new google.maps.MarkerImage('{$icon.url}');
{/foreach}{/if}
{if $generator->get_marker_count()}{literal}
// build the markers
jQuery('#cggm_map_defn_'+mapInstance+' div.cggm_map_markers > div.cggm_marker').each(function(){
  // create the marker object.
  var name = jQuery(":input[name='name']",this).val();
  var lat = jQuery(":input[name='latitude']",this).val();
  var lon = jQuery(":input[name='longitude']",this).val();
  var icon = jQuery(":input[name='icon']",this).val();
  var t_icon = null;
  if( icons != undefined && icon != undefined ) {
    t_icon = icons[icon];
  }
  var title = jQuery(":input[name='title']",this).val();
  var marker = new google.maps.Marker({
    map: mapObj,
    title: title,
    map_instance: mapInstance,
    alias: name,
    icon: t_icon,
    jq: this,
    position: new google.maps.LatLng(lat,lon)
  });
  // store the marker for later retrieval.
  jQuery(this).data('marker',marker);

  {/literal}
  {if $map->info_window && $map->info_trigger != 'none'}
  // add info window triggers.
  google.maps.event.addListener(marker, '{$map->info_trigger}', function() {ldelim}
    handle_info_window(marker);
    {if $map->sv_controls}
    var tmp =mapObj.getStreetView();
    var client = new google.maps.StreetViewService();
    client.getPanoramaByLocation(marker.getPosition(), {$map->sv_radius|default:1000}, function(result, status) {ldelim}
    if (status == google.maps.StreetViewStatus.OK) {ldelim}
      document.getElementById('cggm_sv_display_'+mapInstance).style.display='block';
      tmp.setPosition(result.location.latLng);
    {rdelim}
    {rdelim});
    {/if}
  {rdelim});
  {/if}
  {literal}
}); // each
{/literal}
{/if}

{if isset($kml_files) && count($kml_files) }
{* this kml_files variable is temporary *}
{foreach from=$kml_files item='one_file'}
var kml_layers = new Array();
var kml = new google.maps.KmlLayer('{$one_file}');
kml.setMap(mapObj);
kml_layers.push(kml);
{/foreach}
{/if}

{if $map->sidebar}
{literal}
// handle clicking on sidebar
jQuery('a.cggm_sidebar_title_link').click(function(){
  var tmp = jQuery(this).attr('rel').split('::');
  if( tmp.length == 2 )
  {
    var mkr = jQuery('#map_'+tmp[0]+'_marker_'+tmp[1]).data('marker');
    handle_info_window(mkr);
    {/literal}{if $map->sv_controls}
    mapObj.getStreetView().setPosition(mkr.getPosition());
    {/if}{literal}
  }
});
{/literal}
{/if}

{if $map->directions && $generator->get_marker_count()}
{literal}
// handle disabling any directions
jQuery(":button[name='hide_directions']").click(function(){
  directionsDisplay.setMap(null);
  jQuery(this).parent().hide();
});
{/literal}
{/if}

{literal}
}); // ready function.
//]]>{/literal}
</script>{/jsmin}

Une autre question en passant...
Est-ce qu'il est possible de lier un module tel que listit à cggooglemaps pour une gestion des points simplifiées?

En tout cas, merci pour ton aide.

[Résolu] La géolocalisation a échouée... CGGoogleMap - snatch1974 - 02/03/2014

c'est bon pour la dernière question, j'ai réussi à linké listit à cggooglemaps avec {cggm_add_dynpoint}
Par contre, toujours ce soucis infobulles...

[Résolu] La géolocalisation a échouée... CGGoogleMap - Jean le Chauve - 02/03/2014

Il faut que tu vires les commentaires ligne 1196. Sans doute un <!-- <pre>{$var|var_dump}</pre> --> ou autre en fin de gabarit de page.
Vire le <p> ligne 241 qui englobe des div.
Il y a 2 </p> inutiles qui se promènent en lignes 1023 et 1162.
Ta liste déroulante des stations ne fonctionne pas non plus.

Comme tu as plusieurs js qui tournent sur cette page, teste la carte dans un gabarit minimal afin de voir s'il n'y a pas de conflit.

[Résolu] La géolocalisation a échouée... CGGoogleMap - snatch1974 - 03/03/2014

En effet dans mon gabarit principal j'avais bien une balise de débogage qui avait été commenté... c'est mon erreur!

J'ai viré les <p> qui se baladaient... c'est un peu de ma faute aussi mais ça, je le partage avec le wysiwyg :p

En effet, la liste ne fonctionnait plus...
je travaillais sur une seconde instance de carte "map=2" totalement identique à la première. avec la seconde carte la liste ne fonctionnait pas mais avec la première, pas de soucis, ça fonctionne.

Pourquoi??? va savoir Charles ! :/

Donc, dans l'ensemble tout fonctionne mis à part toujours quelques infobulles récalcitrantes telles que celle de chamonix, qui me met une barre de défilement sans raison.

Je joins mon code de template de listit2 qui me sert à afficher ma carte... tant qu'on y est...

Code :
[== Indéfini ==]
{if $items|@count > 0}
   {foreach from=$items item=item}

      {foreach from=$item->fielddefs item=fielddef}
         {if $fielddef.type == 'Categories' && ($fielddef.value != '')}
            {ListIt2Loader item='category' force_array=1 value=$fielddef.value assign='cats'}
            {assign var="cat" value=$cats|implode:';'}
         {/if}
      {/foreach}

      {if $item->description !=''}{assign var="desc" value="<p>{$item->description}</p>"}{else}{assign var="desc" value="<p>Pas d'information spéciale à noter</p>"}{/if}

      {cggm_add_dynpoint map=1 name=$item->title lat="{$item->Lat}" longitude="{$item->Long}" desc="<h3>{$item->title} <span>({$item->code_postal})</span></h3>{$desc}" category="{$cat}"}


   {/foreach}

{/if}

{CGGoogleMaps map=1}


[Résolu] La géolocalisation a échouée... CGGoogleMap - Jean le Chauve - 03/03/2014

[Résolu] alors ? Smile

[Résolu] La géolocalisation a échouée... CGGoogleMap - snatch1974 - 03/03/2014

Non, pas tout à fait... j'ai édité mon message au dessus à cause d'une barre de défilement inattendue

[Résolu] La géolocalisation a échouée... CGGoogleMap - Jean le Chauve - 03/03/2014

C'est logique, il n'y a pas assez de place pour écrire l'entièreté de la ligne. Tu peux remarquer que dans ta liste, le dernier mot (vallée) passe aussi à la ligne. Il faut bien que l'internaute puisse lire l'entièreté de l'info-bulle.
Tu chipotes, là, non ?
En plus la taille des polices dépend du navigateur (IE 9+ affiche tout sur une ligne et n'affiche pas la barre de défilement) (IE8- la mise en page déconne).
Diminue la taille de la police si tu veux que cela tienne en 1 ligne, augmente la largeur des bulles ou réduit le nombre de caractères...
Par contre, il y a un autre problème sur résolution 1920*1080 : le texte du <p> apparaît sur la gauche de l'écran :<div id="cggm_infowindow_1" style="position: absolute; left: -1000px;">. Il faudrait diminuer le left à -2000px.

[Résolu] La géolocalisation a échouée... CGGoogleMap - snatch1974 - 03/03/2014

Oui, je chipote mais où ce n'est pas logique, c'est d'avoir un une barre avec une hauteur de bulle sur 250.
Un retour à la ligne pourquoi pas mais pk la bulle ne s'agrandit -elle pas verticalement au lieu de balancer un ascenseur. Devoir défiler pour lire 2 lignes, je ne sais pas toi mais moi ça me fait chier à lire.
Changez la taille de la police n'y changera rien puisqu'en fonction des stations il y'aura plus ou moins d'info donc, plus ou moins de lignes et le soucis sera exactement le même.

[Résolu] La géolocalisation a échouée... CGGoogleMap - Jean le Chauve - 03/03/2014

La bulle s'aggrandit à chaque <br>, mais ne crée l'ascenseur que s'il y a un retour à la ligne automatique.
Regarde cette page http://www.promojeunes-amo.be/ressources/annuaire-jeunesse/services-aide-jeunesse-milieu-ouvert-amo.html, clique sur promojeunes amo et regarde la source (je n'ai un ascenseur que dans BADJ Service droit des jeunes car c'est le titre qui est trop long et que je ne peux le diminuer, mais ça ne me gêne pas).
A toi de prévoir une longueur max dans ton champs commentaire ou modifie la valeur de l'input reçue afin d'ajouter un <br> automatique.
Autrement étudie l'api et les js de GoogleMaps ou demande leur de te faire ton gabarit :lol:
Mais ce n'est pas un problème dû au module à mon humble avis.

[Résolu] La géolocalisation a échouée... CGGoogleMap - snatch1974 - 03/03/2014

Le pdg de google est un pote, je vais lui demander de regarder ça! Smile

En attendant, je vais essayer de bricoler une fonction qui fait un retour à la ligne automatiquement au bout d'un certain nombre de caractères... sans césure sur les mots, ce qui serait encore plus inconfortable!

Merci en tout cas

Edit: Réglé avec le modificateur wordwrap de smarty

[Résolu] La géolocalisation a échouée... CGGoogleMap - Jean le Chauve - 03/03/2014

Pratique wordwrap smarty Smile
Bonne continuation sur ton beau site intéressant.
Au fait, la sidebar déroulante vient avec CGGooglemaps ou c'est toi qui l'a codée ?
Si c'est toi, peut-tu nous donner le code ?

[Résolu] La géolocalisation a échouée... CGGoogleMap - snatch1974 - 04/03/2014

la sidebar déroulante, c'est le panneau latéral du module que j'ai modifié au niveau du template + mis en forme et animation par css.


Template carte:


Code :
[== Indéfini ==]
{* map template *}
<div id="cggm_map_defn_{$mapinstance}" class="cggm_maps">
{$map_header|default:''}{$map_marker_data|default:''}


   {* map in the center *}
   <div id="cggm_map_display_{$mapinstance}" style="width: {$map->width}px; height: {$map->height}px;">{* the map will go here *}</div>

   {if $map->sv_controls}
   <div id="cggm_sv_display_{$mapinstance}" style="width: {$map->width}px; height: {$map->height}px; display: none;">{* the streetview will go here *}</div>
   {/if}


   {* optional sidebar on the left *}
   {if isset($map_sidebar)}

     {$map_sidebar}

   {/if}


   {* directions on the right *}
   {if $map->directions_dest == 'PANEL'}

     <div id="map_directions_{$mapinstance}" style="display: none;">
       <input type="button" name="hide_directions" value="{$mod->Lang('hide_directions')}"/><br/>
     </div>

   {/if}


{* optional categories *}
{if isset($map_categories)}

     {$map_categories}

{/if}

{$map_data}
</div>


Template panneau latéral:

Code :
[== Indéfini ==]
{* sidebar template *}

<div class="map-cats">

<h2>Liste des stations <span class="fleche"></span></h2>

<ul class="cggm_sidebar_list">
{$tmp = ksort($sidebar_items)}

{foreach from=$sidebar_items key='marker_name' item='item'}
  <li class="cggm_sidebar_item" rel="{$marker_name}">
    <div>
    <div class="cggm_sidebar_item_title">

{if $map->info_window}<a rel="{$map->get_id()}::{$marker_name}" class="cggm_sidebar_title_link {$item->get_categories()}">{$item->get_title()}</a>{else}{$item->get_title()}{/if}</div>
    <div class="code_postal">
    {$item->get_description()}
    </div>
    {* this is used for hiding sidebar items when categories are disabled *}
    <input type="hidden" name="categories" value="{$item->get_categories()}"/>
    </div>
  </li>
{/foreach}
</ul>

</div>


et pour le css:

Code :
[== CSS ==]
div.cggm_maps{
   position:relative;
   width:660px;
   height:660px;
   margin:0 0 30px 0;
}

div#cggm_map_display_1{
   width:660px;
   height:660px;
   border:solid 5px [[$dark_blue]];
   border-radius:20px;
   overflow:hidden;
}

div.map-cats{
    position:absolute;
    top:5px;
    right:5px;
    width:250px;
    background:[[$white]];
    border-radius: 0 15px 0 0;
}

div.map-cats:hover{
    background:[[$white]];
}

div.map-cats h2{
    font-size:140%;
    line-height:18px;
    text-align:center;
    color:[[$dark_grey]];
    margin:5px 0 5px;
}

div.map-cats h2 span.fleche{
    float:right;
    width:20px;
    height:20px;
    margin:0 20px 0 -10px;
    background:[[$white]] url([[$path]]/dropdown_close.png) left top no-repeat;
   -webkit-transition: all 0.5s ease-in-out;
   -moz-transition: all 0.5s ease-in-out;
   transition: all 0.5s ease-in-out;
}

div.map-cats:hover h2 span.fleche{
   -webkit-transform: rotate(90deg);
   -moz-transform: rotate(90deg);
   transform: rotate(90deg);
}

div.map-cats li{
    list-style:none outside none;
}

div.map-cats ul{
    list-style:none outside none;
    padding:0 0 0 15px;
    margin:0;
    height:0px;
    overflow:hidden;
    transition: all 0.5s ease-out;    
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;  
}

div.map-cats:hover ul{
    height:570px;
    margin:20px 0 20px;
    overflow:auto;
    transition: all 0.5s ease-out;    
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;  
}

div.map-cats div.cggm_sidebar_item_title{
   display:inline-block;
   Width:100%;
   margin:10px 0 0;
}

div.map-cats a{
   line-height:15px;
   font-weight:bold;
   cursor:pointer;
   cursor:hand;
}

div.map-cats div.code_postal{
   display:inline-block;
   font-size:80%;
   font-style: italic;
   margin:0 0 0 10px;
}

div.map-cats div.code_postal h3{
   font-size:100%;
   font-style: italic;
   margin:0;
}

div.map-cats div.code_postal p{
   font-size:100%;
   margin:0;
}

div.cggm_infowindow_item h3{
   font-size:110%;
   margin:0 0 10px;
}

div.cggm_infowindow_item p{
   font-size:100%;
   margin:5px 0;
}

div.map-cats a.friendly, form.category_form div.friendly{
    color:#2fa802;
}

div.map-cats a.conditions, form.category_form div.conditions{
    color:#ffc600;
}

div.map-cats a.interdites, form.category_form div.interdites{
    color:#ff0000;
}

form.category_form{
   font-size:93%;
   font-weight:bold;
   margin:10px 0 0;
}

form.category_form div.category{
   float:left;
   margin:0 15px 0 0;
}

J'ai 3 catégories de point (friendly, conditions et interdites) d'où les 3 couleurs.


pour avoir mes stations par ordre alphabétique affiché dans le panneau latéral, c'est la fonction {$tmp = ksort($sidebar_items)} qui s'en charge dans le template.


Voilà comment je l'ai mis en place!

[Résolu] La géolocalisation a échouée... CGGoogleMap - Jean le Chauve - 04/03/2014

Ah oui ksort ; le tri des points, il m'avait bien embêté et je l'avais résolu en modifiant les id dans la bd. Pourquoi faire simple quand on peut tout compliquer Rolleyes
Merci pour l'astuce. {$sidebar_items|ksort} devrait avoir le même résultat sans créer de fonction, non ?