Google Maps добавляет новый маркер и удаляет старый маркер одним щелчком мыши

-1

Я пытаюсь внедрить Google Maps в JavaFX WebView. У меня есть один маркер в markers[] -Array, который отображается в начале моей программы.Google Maps добавляет новый маркер и удаляет старый маркер одним щелчком мыши

Когда я нажимаю на карту, появляется новый маркер. Итак, у меня есть два.

Если я нажму кнопку, которая вызывает метод deleteOldMarkers(), первый маркер будет удален. Все идет нормально.

Что я пытаюсь сделать, это удалить старый маркер вместе с созданием нового, не нажимая на кнопку все время.

Но если я вызываю функцию deleteOldMarker() вместе с функцией addNewMarkers(), она добавляет только маркеры, но не удаляет старые.

Мой FXML-проект выглядит следующим образом:

FXMLDocument.fxml:

<AnchorPane id="AnchorPane" prefHeight="578.0" prefWidth="905.0"  
xmlns="http://javafx.com/javafx/8.0.60" xmlns:fx="http://javafx.com 
/fxml/1" fx:controller="googlemapstestproject.FXMLDocumentController"> 
    <children> 
     <WebView fx:id="view" layoutX="32.0" layoutY="16.0"  
prefHeight="553.0" prefWidth="848.0" /> 
    </children> 
</AnchorPane>

GoogleMapsTestProject.java:

public class GoogleMapsTestProject extends Application { 

    @Override 
    public void start(Stage stage) throws Exception { 
     Parent root = 
FXMLLoader.load(getClass().getResource("FXMLDocument.fxml")); 

     Scene scene = new Scene(root); 

     stage.setScene(scene); 
     stage.show(); 
    } 
}

FXMLDocumentController.java:

@FXML 
private WebView view; 
@FXML 
private WebEngine webEngine; 
final URL urlGoogleMaps = getClass().getResource("Map.html"); 

@Override 
public void initialize(URL url, ResourceBundle rb) { 

    webEngine = view.getEngine(); 
    webEngine.setJavaScriptEnabled(true); 

    webEngine.load(urlGoogleMaps.toString()); 
    }

}

и, наконец, Map.html:

<html> 
    <head> 
     <title></title> 
     <script src="https://maps.googleapis.com/maps/api/js?key= 
    AIzaSyAOzn0IHzu49M3kuocoMdcDC_BPMUVNA84&signed_in=true"></script> 
     <style>#mapcanvas { height: 100%; width: 100%}</style> 

    </head> 
    <body> 
     <h1></h1> 
     <div id="mapcanvas"> 
      <script type="text/javascript"> 

       var markers = []; 

       document.map = new 
google.maps.Map(document.getElementById("mapcanvas")); 
       var latlng = new google.maps.LatLng(48.8, 9.2); 
       var Options = { 
        zoom: 15, 
        center: latlng, 
        mapTypeId: google.maps.MapTypeId.ROADMAP, 
        streetViewControl: false, 
        zoomControl: false, 
        mapTypeControl: false, 
       }; 
       var map = new 
google.maps.Map(document.getElementById("mapcanvas"), Options); 

       map.addListener('click', function (event) { 
        deleteMarker(); 
        addNewMarkers(event.latLng) 
       }); 


       var map; 
       var markers = []; 

       // Adds a new marker at the current mouse position when 
        clicked 
       map.addListener('click', function (event) { 
        deleteMarker(); 
        addNewMarkers(event.latLng); 
       }); 

       // Adds a marker to the map and pushes it into markers 
        array 
       function addNewMarkers(location) { 
        var marker = new google.maps.Marker({ 
         position: location, 
         map: map, 
         icon: "http://maps.google.com/mapfiles/ms/icons 
           /yellow-dot.png", 
        }); 
        markers.push(marker); 
       } 

       function deleteMarker() { 
        var i; 
        for (i = 0; i < markers.length; i++) { 
         markers[i].setMap(null); 
        } 
        markers = []; 
       } 
       ; 

      </script> 
     </div> 
    </body> 
</html>

источник

2016-11-29 Evo

deleteMarker() должна вызываться после addNewMarkers() –

но Если я wright deleteMarker() после addNewMarkers (event.latLng), старые маркеры по-прежнему не удаляются, он просто продолжает создавать новые – Evo

проверил ли вы длину вашего маркерного массива, а также если он глобальный или нет –

изменение deleteMarker удалить все маркеры (вы не хотите, чтобы первый маркер влево вокруг, вы хотите, последний маркер влево, если вы уже добавили его в массив)
вызова deleteMarker перед вызовом addNewMarkers
Вам не нужно deleteOldMarkers

proof of concept fiddle

фрагмент кода:

function initialize() { 
 
    map = new google.maps.Map(
 
    document.getElementById("map_canvas"), { 
 
     center: new google.maps.LatLng(37.4419, -122.1419), 
 
     zoom: 13, 
 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }); 
 
    map.addListener('click', function(event) { 
 
    deleteMarker(); 
 
    addNewMarkers(event.latLng) 
 
    }); 
 
} 
 
var map; 
 
var markers = []; 
 
google.maps.event.addDomListener(window, "load", initialize); 
 

 
// Adds a marker to the map and pushes it into markers array 
 
function addNewMarkers(location) { 
 
    var marker = new google.maps.Marker({ 
 
    position: location, 
 
    map: map, 
 
    icon: "http://maps.google.com/mapfiles/ms/icons/yellow-dot.png", 
 
    }); 
 
    markers.push(marker); 
 
} 
 

 
function deleteMarker() { 
 
    for (var i = 0; i < markers.length; i++) { 
 
    markers[i].setMap(null); 
 
    } 
 
    markers = []; 
 
};

html, 
 
body, 
 
#map_canvas { 
 
    height: 100%; 
 
    width: 100%; 
 
    margin: 0px; 
 
    padding: 0px 
 
}

<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<div id="map_canvas"></div>

источник

2016-11-29 17:23:00 geocodezip

Я с ума сошел, я вижу, что ваш код работает отлично, и я не вижу никакой разницы с моей. Но он не работает с моим кодом. Я сделал то, что вы предложили.Функция deleteMarker() - удаляет все метки. Но он работает только до тех пор, пока я не ставил функцию перед функцией addNewMarkers(). Если я добавлю функцию deleteMarker() - infront функции addNewMarkers (location, map) в addListener, останутся старые маркеры. Даже если я вызываю метод deleteOldMarkers, нажав кнопку «удалить», удаляется только последний маркер, все остальные остаются – Evo

ok теперь я вижу проблему. Маркеры удаляются, но они только «удаляются», когда я увеличиваю/уменьшаю. Почему он автоматически обновляется в вашем примере @geocodezip? – Evo

Возможно ли, что проблема заключается в том, что я показываю ее в JavaFX WebView, который не перезагружается, когда это должно быть? – Evo

Google Maps добавляет новый маркер и удаляет старый маркер одним щелчком мыши

ответ

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