2011-08-30 1 views
0

En utilisant jQuery plugin gMap de http://gmap.nurtext.de/.jQuery gMap plugin-> problème avec les options construites dynamiquement

Je ne comprends pas pourquoi le premier appel (commenté) fonctionne et affiche la carte correctement mais le second (construit dynamiquement) ne fonctionne pas. La seconde montre une carte mais sans marqueurs et zoomée complètement.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
    <head> 
    <title>GMap Test</title> 
    <script src="/assets/js/jquery-1.6.min.js" type="text/javascript"></script> 
    <script type="text/javascript" src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=My_API_Key"></script> 
    <script type="text/javascript" src="/assets/js/jquery.gmap-1.1.0.js"></script> 
    <script> 
     $(document).ready(function(){ 
     /*  
     $("#course_map").gMap({controls: true, 
           scrollwheel: true, 
           markers: [{latitude: 44.5643, 
              longitude:-88.1033, 
              html: "Radisson/Oneida Casino<br />2040 Airport Drive<br />Green Bay, WI", 
              icon: {image: "/images/gmap_pin_orange.png", 
               iconsize: [26, 46], 
               iconanchor: [12,46], 
               infowindowanchor: [12, 0] 
               } 
             }, 
             {latitude: 44.2674, 
              longitude:-88.4383, 
              html: "Radisson Paper Valley Hotel<br />333 W. College Avenue<br />Appleton, WI", 
              icon: {image: "/images/gmap_pin_orange.png", 
               iconsize: [26, 46], 
               iconanchor: [12,46], 
               infowindowanchor: [12, 0] 
               } 
             } 
             ], 
           zoom: 8 
           } 
          ); 
     */ 

     var markers = 'markers: [{latitude: 44.5643, '+ 
         '   longitude:-88.1033, '+ 
         '   html: "Radisson/Oneida Casino<br />2040 Airport Drive<br />Green Bay, WI", '+ 
         '   icon: {image: "/images/gmap_pin_orange.png", iconsize: [26, 46], '+ 
         '     iconanchor: [12,46], '+ 
         '     infowindowanchor: [12, 0] '+ 
         '     } '+ 
         '   }, '+ 
         '   {latitude: 44.2674, '+ 
         '   longitude:-88.4383, '+ 
         '   html: "Radisson Paper Valley Hotel<br />333 W. College Avenue<br />Appleton, WI", '+ 
         '   icon: {image: "/images/gmap_pin_orange.png", iconsize: [26, 46], '+ 
         '     iconanchor: [12,46], '+ 
         '     infowindowanchor: [12, 0] '+ 
         '     } '+ 
         '   },'; 
     markers = markers.slice(0, -1); 
     markers =  '{controls: true, scrollwheel: true, ' + markers + '], zoom: 8}'; 
     $("#course_map").gMap(markers);     

     });        
    </script> 
    </head> 
    <body> 
    <div id="course_map" style="height:297px; width:380px;border: 2px solid #666;"></div> 
    </body> 
</html> 

Quelqu'un peut-il aider ici?

Répondre

0

Je construis les marqueurs en fonction de la réussite d'un appel ajax comme ceci:

success: function(data) { 
    var markers = { controls: true, scrollwheel: true, markers: [], zoom: 8 }; 
    $.each(data["events"], function(id, event) { 
    // .. do other stuff with the data 
    if(showmap) { 
     // add location to maps list prevent multiples 
     marker1 = { latitude: event['LocLatitude'], 
        longitude:event['LocLongitude'], 
        html: '"'+event['LocName']+'<br />'+event['LocAddress']+'<br />'+event['LocCity']+', '+event['LocState']+'"', 
        icon:{image: "/images/gmap_pin_orange.png", 
         iconsize: [26, 46], 
         iconanchor: [12,46], 
         infowindowanchor: [12, 0] 
         } 
       }; 
     markers.markers.push(marker1); 
    } // if(showmap) 
    } // $.each(data["events"] 
}, // success: 

puis l'appeler comme ceci:

$("#course_map").gMap(markers); 
Questions connexes