Skip to content
Permalink
ae0cd70e3d
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

Wello/multiplemarkers.php

Go to file
 
 
Cannot retrieve contributors at this time
106 lines (71 sloc) 3.43 KB
Raw Blame
// first we will need to work on getting the current location using the google maps API
/// we can get the current location by using the functions form the geolocation.html
// now we use the geolocation to find the list of nearby locations
//https://developers.google.com/maps/documentation/javascript/store-locator?csw=1 is what we are using for reference
<html>
<body>
<script src = "http://maps.google.com/maps/api/js?sensor=false"></script>
<script src = "http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.1.min.js"> < /scipt>
<div id = "map" style = "width: 500pxl height: 400px; "> </div>
<script>
// this will allow us to get the geolocation for where the user is
function getLocation(){
if (navigator.geolocation){
navigator.geolocation.getCurrentPostion(savePostion, postionError, {timeout:10000});
}
else{
//geolocation is not supported by the browser
}
}
function positionError(error){
var errorCode = error.code;
var message = error.message;
alert(message);
}
function savePosition(position){
$_post("geolocation.php", {lat: postion.coords.latitude, lng: position.coords.longitude});
}
// once you get the geolocation: we proceed to getting a list of elements from my mysql database which we will use to find the array of location
</script>
var currentlocation = getLoaction(); // this is where the current location will be stored
<script>
// this is where we shall put the functions that will make our array for us
// we will need to connect the database to this.. which is am not sure of how to do...
select id, (3959* acos(cos(radians(37))))* cos(radians(lat)) * cos(radians(lng) - radians(-122)) + sin(radians(37))* sin(radians(lat)))) AS distance from currentlocation HAVING distance <25 ORDER BY distance LIMIT 0, 20; // this statement gets us the closest 20 locations within the radius fo 25 miles to the coordinate
</script>
<script type = "text/javascript">
// this will allow us to display a map with multiple markers
var locations = ['permit number', -33.890542, 151.274856]; // replace this with the array function that we will be using
var map = new google.maps.Map(document.getElementById('map')){
zoom: 10,
center: new google.maps.LatLng(-390.92, 151.25),s
mapTypeId: google.maps.mapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var marker, i;
var markers = new Array();
for (i = 0; 0< locations.length; i++){
marker = new google.maps.Marker(
{
postion: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map
});
markers.push(marker);
google.maps.event.addEventListener(marker, 'click', (function(marker,i){
return function(){
infowindow.setContent(locations[i][0]);
infowindow.open(map,marker);
}
})(marker,i));
}
function autoCenter(){
var bounds = new google.maps.LatLngBounds();
$.each(marker, function(index, marker){
bounds.extend(marker.position);
});
map.fitBounds(bounds);
}
autoCenter();
</script>
</body>
</html>