jquery load et api google maps

Bonsoir.

j'aimerais attendre avant l'affichage ou bien afficher une fois que c'est totalement chargé

Pourrais-tu être plus précis ?
Et puis, tu ne nous dis pas si tu as des erreurs en retours dans la console, ni même de ce qui se passe actuellement, pour faire simple, tu ne nous dit pas ce que tu as en retour.

J'appel donc une page qui m'affiche la distance entre deux villes donc une map avec les deux pointeurs et un trait bleu pour indiquer le trajet parfois la map s'initialise s'eulement ou bien la map se charge mais il manque le trait bleu ou alors elle est complete ce n'est pas toujours le même affichage

voici le code de la page distance

 <div id="map">
            <p>Veuillez patienter pendant le chargement de la carte...</p>
        </div>
<input type="hidden" name="origin" id="origin" value="<?php echo $ma_ville; ?>">
<input type="hidden" name="destination" id="destination" value="<?php echo $profil_ville; ?>">    

    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&language=fr&key=AIzaSyBnGas2__Wr6Aup2Iu_5awuqGPf1LTCPM8"></script>
<script>
var map;
var panel;
var initialize;
var calculate;
var direction;

initialize = function(){
  var latLng = new google.maps.LatLng(50.6371834, 3.063017400000035); // Correspond au coordonnées de Lille
  var myOptions = {
    zoom      : 14, // Zoom par défaut
    center    : latLng, // Coordonnées de départ de la carte de type latLng 
    mapTypeId : google.maps.MapTypeId.TERRAIN, // Type de carte, différentes valeurs possible HYBRID, ROADMAP, SATELLITE, TERRAIN
    maxZoom   : 20
  };

  map      = new google.maps.Map(document.getElementById('map'), myOptions);
  panel    = document.getElementById('panel');

  var marker = new google.maps.Marker({
    //position : latLng,
    //map      : map,
    //title    : "Lille"
    //icon     : "marker_lille.gif" // Chemin de l'image du marqueur pour surcharger celui par défaut
  });

    var contentMarker = [
      '<div id="containerTabs">',
      '<div id="tabs">',
      '<ul>',
        '<li><a href="#tab-1"><span>Lorem</span></a></li>',
        '<li><a href="#tab-2"><span>Ipsum</span></a></li>',
        '<li><a href="#tab-3"><span>Dolor</span></a></li>',
      '</ul>',
      '<div id="tab-1">',
        '<h3>Lille</h3><p>Suspendisse quis magna dapibus orci porta varius sed sit amet purus. Ut eu justo dictum elit malesuada facilisis. Proin ipsum ligula, feugiat sed faucibus a, <a href="http://www.google.fr">google</a> sit amet mauris. In sit amet nisi mauris. Aliquam vestibulum quam et ligula pretium suscipit ullamcorper metus accumsan.</p>',
      '</div>',
      '<div id="tab-2">',
       '<h3>Aliquam vestibulum</h3><p>Aliquam vestibulum quam et ligula pretium suscipit ullamcorper metus accumsan.</p>',
      '</div>',
      '<div id="tab-3">',
        '<h3>Pretium suscipit</h3><ul><li>Lorem</li><li>Ipsum</li><li>Dolor</li><li>Amectus</li></ul>',
      '</div>',
      '</div>',
      '</div>'
  ].join('');

  var infoWindow = new google.maps.InfoWindow({
    content  : contentMarker,
    position : latLng
  });

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

  google.maps.event.addListener(infoWindow, 'domready', function(){ // infoWindow est biensûr notre info-bulle
    jQuery("#tabs").tabs();
  });

  direction = new google.maps.DirectionsRenderer({
    map   : map,
    panel : panel // Dom element pour afficher les instructions d'itinéraire
  });

      origin      = document.getElementById('origin').value; // Le point départ
    destination = document.getElementById('destination').value; // Le point d'arrivé
    if(origin && destination){
        var request = {
            origin      : origin,
            destination : destination,
            travelMode  : google.maps.DirectionsTravelMode.DRIVING // Mode de conduite
        }
        var directionsService = new google.maps.DirectionsService(); // Service de calcul d'itinéraire
        directionsService.route(request, function(response, status){ // Envoie de la requête pour calculer le parcours
            if(status == google.maps.DirectionsStatus.OK){
                direction.setDirections(response); // Trace l'itinéraire sur la carte et les différentes étapes du parcours
            }
        });
    }

};

initialize();

</script>  

En gros, tu charges en ajax un code HTML + JS qui doit ensuite être éxecuté ?
C'est à mon avis une mauvaise méthode.

oui c'est bien ça

quelqu'un aurais une solution?

merci ça marche nickel j'ai simplement fait comme tu m'as dit:

Je charge l'api sur la page principale et ça fonctionne impec