Google Maps, как изменить значок маркера на значок, который указан в каталоге из базы данных SQL?

-1

Привет всем, мне было интересно, может ли кто-нибудь помочь мне с моим кодом. Я хочу изменить значок маркера на значок, который указан в каталоге из базы данных SQL. Вот ссылка на захват экрана базы данных. http://i.stack.imgur.com/SriRX.png Google Maps, как изменить значок маркера на значок, который указан в каталоге из базы данных SQL?

Эта база данных отлично работает с PHP на моем веб-сайте, кроме значков. Как показано на снимке экрана по этой ссылке. http://i.stack.imgur.com/ccGP1.png

Кажется, что последний значок, указанный в базе данных, является значком, который используется для всех маркеров, но я не хочу, чтобы это произошло, вместо этого я хочу, чтобы отдельные маркеры выглядели по-разному. Информация, содержащаяся в маркерах, также верна. В нижней части окна содержимого отображается каталог значков, который является правильным для всех, но я понятия не имею, почему я не могу заставить фактический значок изменить каталог, указанный в поле содержимого. Ниже приведен пример кода PHP используется:

<html> 
<head> 
<script type='text/javascript' src='js/jquery-1.6.2.min.js'></script> 
<script type='text/javascript' src='js/jquery-ui-1.8.14.custom.min.js'></script> 
<style> 

    BODY {font-family : Verdana,Arial,Helvetica,sans-serif; color: #000000; font-size : 13px ; } 

    #map_canvas { width:100%; height: 100%; z-index: 0; } 
</style> 
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false" /></script> 
<script type='text/javascript'> 

//This javascript will load when the page loads. 
jQuery(document).ready(function($){ 

     //Initialize the Google Maps 
     var geocoder; 
     var map; 
     var markersArray = []; 
     var infos = []; 

     geocoder = new google.maps.Geocoder(); 
     var myOptions = { 
       zoom: 9, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      } 
     //Load the Map into the map_canvas div 
     var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
     map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

     //Initialize a variable that the auto-size the map to whatever you are plotting 
     var bounds = new google.maps.LatLngBounds(); 
     //Initialize the encoded string  
     var encodedString; 
     //Initialize the array that will hold the contents of the split string 
     var stringArray = []; 
     //Get the value of the encoded string from the hidden input 
     encodedString = document.getElementById("encodedString").value; 
     //Split the encoded string into an array the separates each location 
     stringArray = encodedString.split("****"); 

     var x; 
     for (x = 0; x < stringArray.length; x = x + 1) 
     { 
      var addressDetails = []; 
      var marker; 
      //Separate each field 
      addressDetails = stringArray[x].split("&&&"); 
      //Load the lat, long data 
      var lat = new google.maps.LatLng(addressDetails[1], addressDetails[2]); 
      //Create a new marker and info window 
      marker = new google.maps.Marker({ 
       map: map, 
       position: lat, 
       icon: icon, 
       //Content is what will show up in the info window 
       content: addressDetails[0] 
      }); 
      //Pushing the markers into an array so that it's easier to manage them 
      markersArray.push(marker); 
      google.maps.event.addListener(marker, 'click', function() { 
       closeInfos(); 
       var info = new google.maps.InfoWindow({content: this.content}); 
       //On click the map will load the info window 
       info.open(map,this); 
       infos[0]=info; 
      }); 
      //Extends the boundaries of the map to include this new location 
      bounds.extend(lat); 
     } 
     //Takes all the lat, longs in the bounds variable and autosizes the map 
     map.fitBounds(bounds); 

     //Manages the info windows 
     function closeInfos(){ 
     if(infos.length > 0){ 
      infos[0].set("marker",null); 
      infos[0].close(); 
      infos.length = 0; 
     } 
     } 

}); 
</script> 

</head> 
<body> 
<div id='input'> 

    <?php 
//Connect to the MySQL database that is holding your data, replace the x's with your data 
mysql_connect("localhost", "xxxx_xxxx", "xxxx") or 
die("Could not connect: " . mysql_error()); 
mysql_select_db("xxxx_map"); 

//Initialize your first couple variables 
$encodedString = ""; //This is the string that will hold all your location data 
$x = 0; //This is a trigger to keep the string tidy 

//Now we do a simple query to the database 
$result = mysql_query("SELECT * FROM `markers`"); 

//Multiple rows are returned 
while ($row = mysql_fetch_array($result, MYSQL_NUM)) 
{ 
//This is to keep an empty first or last line from forming, when the string is split 
if ($x == 0) 
{ 
    $separator = ""; 
} 
else 
{ 
    //Each row in the database is separated in the string by four *'s 
    $separator = "****"; 
} 
//Saving to the String, each variable is separated by three &'s 
$image = $row[4]; 
$icon = $row[5]; 
$description = $row[6]; 
$encodedString = $encodedString.$separator. 
"<p class='content' align='center'><b><img src='".$image."' width='147' height='150'><br/><br>".$description."<br>".$icon."</b> ". 
"</p>&&&".$row[1]."&&&".$row[2]; 

$x = $x + 1; 
} 
?> 
<script> 
icon = '<?php echo $icon ?>'; 
</script> 

    <input type="hidden" id="encodedString" name="encodedString" value="<?php echo $encodedString; ?>" /> 
    <hr> 
    <input type="text" id="icon" name="icon" value="<?php echo $icon; ?>" /> 
</div> 
<div id="map_canvas"></div> 
</body> 
</html>

источник

2015-09-23 T.Cunningham

Вы устанавливаете icon значение последнего извлекается из базы данных в этой части кода

<script> 
icon = '<?php echo $icon ?>'; 
</script>

Вы должны, вместо этого, получить его из addressDetails Строка, как вы сделали для широты, долготы и содержания.

источник

2015-09-23 10:52:57 GUL

Отлично! спасибо –

Google Maps, как изменить значок маркера на значок, который указан в каталоге из базы данных SQL?

ответ

Смежные вопросы