now using Google Maps API v.3

This commit is contained in:
Espen Antonsen 2009-07-08 16:52:21 +02:00
parent e363680e86
commit 4fd99b4570
2 changed files with 48 additions and 59 deletions

View file

@ -1,5 +1,5 @@
<% content_for :javascript do %> <% content_for :javascript do %>
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false&amp;key=ABQIAAAA2ASeVD5kkQjUA-G_DcpW6xTYEJCoV24wtogQseyPWcfAg67ZQBRSqFfegsi4Rb7m5RD95qnEcX8gNg" type="text/javascript"></script> <script src="http://maps.google.com/maps/api/js?sensor=true" type="text/javascript"></script>
<script src="/javascripts/tag/tag.js" type="text/javascript" charset="utf-8"></script> <script src="/javascripts/tag/tag.js" type="text/javascript" charset="utf-8"></script>
<% end %> <% end %>

View file

@ -12,66 +12,55 @@ jQuery(function($) {
$('#map_canvas').show() $('#map_canvas').show()
} }
$("#album_address").change( function () { $("#album_address").change( function() {
var geocoder = new GClientGeocoder() var geocoder = new google.maps.Geocoder()
//console.log( $("#album_address").val() ) var address = this.value
geocoder.getLatLng( $("#album_address").val() , function(point) { if (geocoder) {
//console.log( point ) geocoder.geocode( { 'address': address}, function(results, status) {
if ( point ) { if (status == google.maps.GeocoderStatus.OK) {
if (typeof map == "undefined") { if (status != google.maps.GeocoderStatus.ZERO_RESULTS) {
$('#map_canvas').show() map.set_center(results[0].geometry.location)
mapInitialize() mapCreateMarker( {
} title: $('#album_title').val(),
address: results[0].formatted_address,
$('#album_latitude').val( point.lat() ) position: results[0].geometry.location
$('#album_longitude').val( point.lng() ) }
map.setCenter(new GLatLng( $('#album_latitude').val(), $('#album_longitude').val()), 13); )
var marker = mapCreateMarker( { 'title' : $("#album_title").val(), 'address' : $("#album_address").val(), 'latitude': point.lat(), 'longitude' : point.lng() } );
map.addOverlay(marker); } else {
} alert("No results found")
else }
{ } else {
$('#map_canvas').hide() alert("Geocode was not successful for the following reason: " + status)
} }
} });
)
}
)
function mapInitialize() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map_canvas"));
map.setUIToDefault();
map.setCenter(new GLatLng( $('#album_latitude').val(), $('#album_longitude').val()), 13);
var marker = mapCreateMarker( { 'id' : $("#album_id").val(), 'title' : $("#album_title").val(), 'address' : $("#album_address").val(), 'latitude': $("#album_latitude").val(), 'longitude' : $("#album_longitude").val() } );
map.addOverlay(marker);
map.setCenter( new GLatLng( $("#album_latitude").val(), $("#album_longitude").val() ), 13 )
locations_on_map[ $("#album_id").val() ][0].openInfoWindowHtml( locations_on_map[ $("#album_id").val() ][1] )
}
}
function mapProcessData(data) {
var locations = eval('(' + data + ')');
for (var i=0; i<locations.length; i++) {
var marker = mapCreateMarker(locations[i].location )
if ( marker ) {
map.addOverlay( marker )
} }
})
function mapInitialize() {
var latlng = new google.maps.LatLng($('#album_latitude').val(), $('#album_longitude').val());
var myOptions = {
zoom: 13,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
} }
} map = new google.maps.Map(document.getElementById("map_canvas"), myOptions)
}
function mapCreateMarker(location) { function mapCreateMarker(location) {
if ( !location.latitude || !location.longitude ) { var marker = new google.maps.Marker({
return false; map: map,
} position: location.position,
var marker = new GMarker( new GLatLng(parseFloat( location.latitude), parseFloat( location.longitude) ) ) title: location.title
var html = "<b>" + location.title + "</b> <br/>" + location.address + "<br /><br/>" })
locations_on_map[location.id] = [marker, html]
GEvent.addListener(marker, 'click', function() { var infowindow = new google.maps.InfoWindow({
marker.openInfoWindowHtml(html); content: '<b>' + location.title + '</b><br/>' + location.address
}); })
return marker
}
//$('div.scrollable').scrollable().click( $('#gallery ul').children().index( $('#gallery li.active') ) ) google.maps.event.addListener(marker, 'click', function() {
}); infowindow.open(map,marker)
})
}
})