0

我在 Google Maps 上创建了两个自定义按钮来创建标记 当我单击按钮 1 时，它会创建一个带有一个图标的标记，当我单击按钮 2 时，它会创建一个带有另一个图标的按钮，但是当我首先单击一个按钮时，创建标记然后在另一个按钮中，并创建另一个标记，它创建 2 个按钮，一个在另一个前面。我不知道为什么，这是我的代码：

这是我的例子 

var map, ren, ser;

var marker;
var infowindow;
var doMark = false ;
var doMark2 = false;



//Função de Inicio

function goma()
{
    if (doMark == 0)
    {
        doNothing();
    }
    var mapDiv = document.getElementById('mappy');

    var mapOptions = {
    zoom: 12, 

    center: new google.maps.LatLng(-23.563594, -46.654239),
    mapTypeId : google.maps.MapTypeId.ROADMAP
    }

    map = new google.maps.Map( mapDiv, mapOptions );


    var teste = document.createElement('DIV');
    teste.style.padding = '1px';
    teste.style.border = '1px solid #000';
    teste.style.backgroundColor = 'white';
    teste.style.cursor = 'pointer';
    teste.innerHTML = '<img src="http://i47.tinypic.com/2dlp2fc.jpg" border="0" alt="Image and video hosting by TinyPic">';
    teste.index = 1;


    map.controls[google.maps.ControlPosition.TOP_RIGHT].push(teste);

        var rest = document.createElement('DIV2');
    rest.style.padding = '1px';
    rest.style.border = '1px solid #000';
    rest.style.backgroundColor = 'white';
    rest.style.cursor = 'pointer';
    rest.innerHTML = '<img src="http://i45.tinypic.com/2yua8ns.png" border="0">';
    rest.index = 1;
    map.controls[google.maps.ControlPosition.TOP_RIGHT].push(rest);

    google.maps.event.addDomListener(teste, 'click', function() 
    {
        doMark = true;
        doMark2 = false;
        markNow();
    });
    google.maps.event.addDomListener(rest, 'click', function() 
    {

        doMark = false;
        doMark2 = true;
        markNow2();
    });

}   

var string = JSON.stringify(data2)

function downloadUrl(url, callback) 
{
    var request = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
    request.open('POST',url);
    request.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    request.send('command=save&marker='+string)
    request.onreadystatechange = function()
    { 
        if(request.readyState==4) 
        {
            if(request.responseText.indexOf('bien')+1)
            {
                alert('Mapa Atualizado !');
            }
            else
            {
                alert(request.responseText);
            }
        }
    }
}

function markNow()
{
    //doMark2 = true;
    if (doMark == true)
    {

        google.maps.event.addListener(map, "click", function(event) 
        {

            marker = new google.maps.Marker({ position: event.latLng, map: map});
            if (doMark ==1)
            google.maps.event.addListener(marker, "click", function() 
            {
                infowindow.open(map, marker);
            });
        });
        var html = "<table>" +
           "<tr><td>Nome:</td> <td><input type='text' id='name'/> </td> </tr>" +
           "<tr><td>Endereco:</td> <td><input type='text' id='address'/></td> </tr>" +
           "<tr><td>Tipo:</td> <td><select id='type'>" +
           "<option value='oficina' SELECTED>oficina</option>" +
           "<option value='restaurante'>restaurante</option>" +
           "</select> </td></tr>" +
           "<tr><td></td><td><input type='button' value='Salvar' onclick='saveData()'/></td></tr>";

infowindow = new google.maps.InfoWindow({content: html});
    }
}

function markNow2()
{

    if (doMark2 == true)
    {

        google.maps.event.addListener(map, "click", function(event) 
        {
            doMark = 0
            marker = new google.maps.Marker({ position: event.latLng, map: map, icon: 'http://i45.tinypic.com/2yua8ns.png' });
            google.maps.event.addListener(marker, "click", function() 
            {
                infowindow.open(map, marker);
            });
        });
        var html = "<table>" +
           "<tr><td>Nome:</td> <td><input type='text' id='name'/> </td> </tr>" +
           "<tr><td>Endereco:</td> <td><input type='text' id='address'/></td> </tr>" +
           "<tr><td>Tipo:</td> <td><select id='type'>" +
           "<option value='oficina' SELECTED>restaurante</option>" +
           "<option value='restaurante'>oficina</option>" +
           "</select> </td></tr>" +
           "<tr><td></td><td><input type='button' value='Salvar' onclick='saveData()'/></td></tr>";

infowindow = new google.maps.InfoWindow({content: html});
    }

}
4

1 回答 1

1

您有 2 个函数 markNow() 和 markNow2()，它们一起在另一个之上创建一个标记。在 markNow() 中，应在函数内选择标记。其余代码在两个函数中是等效的。

删除 markNow2() 并将 markNow() 更改为

function markNow(){   

    google.maps.event.addListener(map, "click", function(event) 
    {
        if (doMark == true){
        alert("Marker 1 Chosen");
        marker = new google.maps.Marker({ position: event.latLng, map: map});
        }
        if (doMark2 == true){
        alert("Marker 2 Chosen");
        marker = new google.maps.Marker({ position: event.latLng, map: map, icon: 'http://i45.tinypic.com/2yua8ns.png' });
        }
        //if (doMark ==1)
        google.maps.event.addListener(marker, "click", function() 
        {
            infowindow.open(map, marker);
        }
        );
    }
    );
    var html = "<table>" +
       "<tr><td>Nome:</td> <td><input type='text' id='name'/> </td> </tr>" +
       "<tr><td>Endereco:</td> <td><input type='text' id='address'/></td> </tr>" +
       "<tr><td>Tipo:</td> <td><select id='type'>" +
       "<option value='oficina' SELECTED>oficina</option>" +
       "<option value='restaurante'>restaurante</option>" +
       "</select> </td></tr>" +
       "<tr><td></td><td><input type='button' value='Salvar' onclick='saveData()'/>     </td></tr>";

  infowindow = new google.maps.InfoWindow({content: html});


}

这仅允许 1 个标记。

在函数 goma() 中最后从 markNow2() 更改；标记现在（）；

于 2012-09-11T19:39:49.653 回答