2012-03-06 10 views
0

私はMYSQLデータベースから複数のマーカーを取得しました。この方法でマップに入れました。ここで値をHTMLフォームに入れて渡します。私は、ユーザーがそのマーカーをドラッグし、その新しいを更新できるように、ユーザーは、マーカーのドラッグ可能なプロパティを切り替えることができるようにHTMLフォームにボタンを追加したいと思い、今google maps v3 SQLデータベースから取り出されたマーカーのトグルドラッグ可能なプロパティ

function initialize() 
{ 
    map = new google.maps.Map(document.getElementById("map"), 
    { 
     center: new google.maps.LatLng(25.230828, 118.041382),  
     zoom: 4, 
     mapTypeControl: true 
    }); 

    <? //PHP PART 

     // Do a mysql_query 
     $sql = mysql_query("SELECT * from temple"); 

     if(mysql_num_rows($sql)) 
     { 
      // get values from mysql_query and add on to map 
      while ($row = mysql_fetch_array($sql)) 
      { 

       $id = $row['id']; 
       $rom_name=$row['rom_name']; 
       $chi_name=$row['chi_name']; 
       $lat=$row['lat']; 
       $lon=$row['lon']; 


       $html = '<div id="form_container" style="margin:0px;border:0px solid red;Width:521px;height:330px;">'. 
         '<form name="edit_existing" action="phpedit.php" method = "POST" enctype="multipart/form-data">'.       
          '<input type="hidden" style="display:none" name="update_id" value ="'.$id.'"/>'. 
          '<input type="text" name="update_chi_name" value ="'.$chi_name.'"/></td>'. 
          '<table class="form_table" bgcolor="#FFFFFF" style="font-size: 0.90em; border:none 0px #cacaca; margin-bottom:0">'. 
          '<td style="padding:4px 0px 2px 0px"><input type="text" name="update_rom_name" value ="'.$rom_name.'"/></td>'. 
          '<input style="margin-left:8px;float:right" type="submit" name="delete_data" onclick="confirm_delete()" value="Delete this data"/>'.        '</form>'. 
         '</div>';        

       echo ("addMarker($lat, $lon, '$chi_name', '$html');\n"); 

      } 
     } 

    ?> 

} 

//ADD MARKER TO THE MAP 
function addMarker(lat, lng, name, info) 
{ 
    var pt = new google.maps.LatLng(lat, lng); 
    bounds.extend(pt); 

    var marker = new MarkerWithLabel // using MarkerWithLabel utility library 
    ({ 
     icon:icon, 
     position: pt, 
     draggable: false, 
     raiseOnDrag: true, 
     map: map, 
     labelContent: name, 
     labelAnchor: new google.maps.Point(22, 28), 
     labelClass: "labels", // the CSS class for the label 
     labelStyle: {opacity: 1}, 
    }); 

    var popup = new google.maps.InfoWindow 
    ({ 
     maxWidth: 800 
    }); 

    google.maps.event.addListener(marker, "click", function() 
    { 
     popup.setContent(info); 
    }); 
} 

:addmarker機能は、マーカーを作成しますフォームを提出してください。それ、どうやったら出来るの?

ありがとうございます!

答えて

0

マップ上にあるマーカーを参照する必要があります。マーカを作成したら、それを配列にプッシュするだけです。あなたが特定のマーカーのドラッグ可能にしたいときに

var markers = {}; 

function addMarker(lat, lng, name, info) 
{ 
    var pt = new google.maps.LatLng(lat, lng); 
    bounds.extend(pt); 

    var marker = new MarkerWithLabel // using MarkerWithLabel utility library 
    ({ 
     icon:icon, 
     position: pt, 
     draggable: false, 
     raiseOnDrag: true, 
     map: map, 
     labelContent: name, 
     labelAnchor: new google.maps.Point(22, 28), 
     labelClass: "labels", // the CSS class for the label 
     labelStyle: {opacity: 1}, 
    }); 

    ... 

    markers.push(marker); 
} 

そして:あなたはドラッグ可能なように、1つを設定したいときに、あなたはそれにsetDraggableを呼び出すことができます

markers[i].setDraggable(true); 
関連する問題