google maps v3 переключает перетаскиваемое свойство маркеров, извлекаемых из базы данных SQL

Question

У меня есть несколько маркеров, извлеченных из базы данных MYSQL, и я поместил их на карту таким образом, где я помещаю значения в html-форму в php и передаю их в функцию addmarker для создания маркеров:

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);
    });
}

Теперь я хотел бы добавить кнопку в HTML-форму, чтобы пользователи могли переключать свойство перетаскивания маркера, чтобы пользователи могли перетащить этот маркер и обновить его новую позицию, отправив форму.Как я могу это сделать?

Спасибо!

Answer 1

Вам необходимо сохранить ссылку на маркеры, которые есть на карте. Как только вы создали маркер, вы можете просто поместить его в массив. Затем, когда вы хотите установить его как перетаскиваемый, вы можете просто вызвать для него setDraggable:

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);
}

А потом, когда вы хотите сделать определенный маркер перетаскиваемым:

markers[i].setDraggable(true);