I have two radio button. When the first is checked, i display a google map with some markers in it . I would like that when i check the second radion button, it display that same map, but without the markers. Could you help please?
<div><input type="radio" name="reception" id="rad" value="livraison"> Livraison</div>
<div><input type="radio" name="reception" value="point"> Point de récuperation</div>
<div id="map" style=" display:none; height: 300px; border: 1px solid red;"></div>
<script type="text/javascript">
window.onload=function(){
var receps=document.querySelectorAll('[name=reception]');
for (var i = 0; i < receps.length ; i++)
{
receps[i].onclick=function(e){
if(e.target.value == 'livraison'){
document.getElementById('map').style.display = 'block';
}
else{
//How to display the map without markers
}
}
}
There is the callback function of the maps api:
function initMap() {
var sp = {lat: 23.54565, lng: 11.453};
var metro_a={lat:12.4545 , lng: 13.3148};
var metro_n={lat:10.934329596 , lng: 10.323665372};
var lieux=[
{
nom: "MT" ,
coordonnees:{lat: 11.93863, lng: 10.31413}
},
{
nom: "MA",
coordonnees:{lat:19.9361 , lng: 10.3148}
},
{
nom:"MN" ,
coordonnees:{lat:18.936 , lng: 10.323665372}
}
];
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 14,
center: sp
});
//--------------------------------------------------------------
for (var i = 0; i < lieux.length; i++) {
var marker= new google.maps.Marker({
position:lieux[i].coordonnees,
nom:lieux[i].nom,
map:map
});
}
Aucun commentaire:
Enregistrer un commentaire