1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97
|
<html style="background: rgb(204, 204, 204)" >
<head>
<meta charset="UTF-8" />
<title>UAV maps</title>
<link rel="icon" type="icon/png" href="icone.png">
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"></script>
<link rel="stylesheet" type="text/css" href="css.css"/>
<script src="jquery-2.1.1.min.js"></script>
</head>
<h1>
<center><strong> UAV Maps </strong></center>
<div> <img src="images.png" type ="image/png"/></div>
</h1>
<body>
<div id="map">
<input id="calc" type="image" src="icon_calculatrice.png" class="img1"/>
<input type="checkbox" id="test" name="test" onclick="check()" />
<input type="button" id="but" value="effacer" onclick=""/>
</div>
<script>
var marqueur;
var map;
var markertest;
// checkbox initialiser a faux au chargement de la page
unable_check=document.getElementById("test");
unable_check.checked=false;
// test de la checkbox pour connaitre sont état
var test_check = false;
var efface = document.getElementById('test');
function check() {
if (efface.checked == true ){
test_check = true;
console.log('ok');
}
else if ( efface.checked == false)
{ test_check = false
console.log('NOK');
}
}
// affichage de la carte aux coordonnées et au niveau de zoom choisis
map = L.map('map').setView([-85, -179.65], 10);
// création de la carte avec les tuiles présente dans le dossier
L.tileLayer('eso/{z}/{x}/{y}.jpg', {
minZoom: 9,
maxZoom: 15,
attribution: 'Universidade de Lisboa/Antony Vigneron',
tms:true
}).addTo(map);
map.on('click', onMapClick);
// fonction affichant un marker lors du clic sur un point de la carte. mofication de l'affichage de la souris
// affichage d'un marker test
markertest=L.marker([-85, -179.65]);
map.addLayer(markertest);
//fonction affichant le marker lors du clic
function onMapClick(e) {
if (test_check==true){
var curseur = document.getElementById('map');
curseur.style.cursor='pointer';
var coord = e.latlng.toString();
marqueur = L.marker([e.latlng.lat,e.latlng.lng]);
map.addLayer(marqueur);
var x = e.latlng.lat;
var y = e.latlng.lng;
console.log(x,y);
}
else if (test_check==false){
var curseur = document.getElementById('map');
curseur.style.cursor='grab';
}
}
</script>
</body>
</html> |
Partager