2
我通过AJAX加载谷歌地图，并为somereason，它返回一个静态地图图像（正确居中），但我不能平移，缩放或任何其他有点无用的控制。这里是我通过使用appendChild（）谷歌地图JavaScript API正在返回静态图像
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true" language="JavaScript"></script>
<script type="text/javascript" language="JavaScript">
var map;
var map_icon_green = new google.maps.MarkerImage("http://www.mysite.com/images/site/map/green_pointer.png",
new google.maps.Size(12,20),
new google.maps.Point(0,0));
var map_icon_blue = new google.maps.MarkerImage("http://www.mysite.com/images/site/map/blue_pointer.png",
new google.maps.Size(12,20),
new google.maps.Point(0,0));
var map_icon_yellow = new google.maps.MarkerImage("http://www.mysite.com/images/site/map/yellow_pointer.png",
new google.maps.Size(12,20),
new google.maps.Point(0,0));
var map_icon_red = new google.maps.MarkerImage("http://www.mysite.com/images/site/map/red_pointer.png",
new google.maps.Size(12,20),
new google.maps.Point(0,0));
var map_icon_shadow = new google.maps.MarkerImage("http://www.mysite.com/images/site/map/shadow.png",
new google.maps.Size(28,20),
new google.maps.Point(-6,0));
var map_crosshair = new google.maps.MarkerImage("http://www.mysite.com/images/site/cross-hair.gif",
new google.maps.Size(17,17),
new google.maps.Point(0,0));
alert('here');
var google_place_add_interval = 0;
function google_place_add(map) {
if(map.getCenter()!=null) {
cMarker = new google.maps.Marker({
map: map,
icon: map_crosshair
});
var center = map.getCenter();
cMarker.setPosition(map.getCenter());
document.getElementById("gallery_map_points_1845187_long").value=center.lng();
document.getElementById("gallery_map_points_1845187_lat").value=center.lat();
google.maps.event.addListener(map, 'center_changed', function() {
var center = map.getCenter();
cMarker.setPosition(center);
document.getElementById("gallery_map_points_1845187_long").value=center.lng();
document.getElementById("gallery_map_points_1845187_lat").value=center.lat();
});
window.clearInterval(google_place_add_interval);
}
}function gallery_map_upload_1845187() {
var myOptions = {
zoom: 9,
mapTypeId: google.maps.MapTypeId.ROADMAP,
scrollwheel:false
}
map = new google.maps.Map(document.getElementById('gallery_map_loader_1845187'),myOptions);
map.setCenter(new google.maps.LatLng(53.42,-1.242));
map.disableDoubleClickZoom = false;
//var customUI = map.getDefaultUI();
//customUI.controls.scalecontrol = false;
//map.setUI(customUI);
function TextualLocationFinder() {
// Creates a one DIV for each of the buttons and places them in a container
// DIV which is returned as our control element. We add the control to
// to the map container and return the element for the map class to
// position properly.
var container = document.createElement("div");
var search_text = document.createElement("input");
search_text.type='text';
search_text.id='map_location_search_input';
var search_button = document.createElement("input");
search_button.type='button';
search_button.value = 'Search';
container.style.marginLeft = '5px';
google.maps.event.addDomListener(search_button, 'click', function() {
var geocoder = new google.maps.Geocoder();
geocoder.geocode({ 'address': document.getElementById('map_location_search_input').value,'region': "UK"}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
map.setZoom(13);
} else {
alert(document.getElementById('map_location_search_input').value + " not found");
}
});
});
container.appendChild(search_text);
container.appendChild(search_button);
return container;
}
alert('load');
map.controls[google.maps.ControlPosition.LEFT_BOTTOM].push(TextualLocationFinder());
//map.addControl(new TextualLocationFinder());
map.streetViewControl = false;
google_place_add_interval = setInterval("google_place_add(map)", 500);
}
function map_create_marker(point,html,icon) {
var marker = new google.maps.Marker({
position: point,
map: map,
icon: icon
});
if(html!="") {
marker['number'] = 1;
var infowindow = new google.maps.InfoWindow({
content: html
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
}
return marker;
}
var map_set_center = 0;
function map_load_resize() {
if(map_set_center==0) {
map.setCenter(new google.maps.LatLng(53.42,-1.242));
}
map_set_center = 1;
}
</script>
<table><tr><td class="field_name field_padding_min" valign="top">Include Map Location:</td><td><input onclick="gallery_photo_create_map(this,'1845187');" id="map_location_1845187" name="map_location" type="checkbox" value="1" />
<span class="form_hint">Check this to add your photo to a map.</span> <span class="small_text red_highlight"><strong>The location you enter will be viewable by others</strong></span>
<input type="hidden" name="gallery_map_points_lat" id="gallery_map_points_1845187_lat" value=""/>
<input type="hidden" name="gallery_map_points_long" id="gallery_map_points_1845187_long" value=""/>
</td></tr>
<tr><td colspan="2"><div id="gallery_map_loader_1845187" ></div></td></tr>
</table>
仅供参考输入JavaScript和HTML，这就是所谓的复选框点击功能：
function gallery_photo_create_map(checkbox,loader) {
if(!loader){
loader = '';
}
if(checkbox.checked==true) {
document.getElementById('gallery_map_loader'+loader).style.height = '200px';
ShowHide('gallery_map_loader'+loader,'visible');
if(gallery_photo_create_map_check==0) {
//gallery_map_upload();
func_name = 'gallery_map_upload'+loader;
window[func_name]();
}
gallery_photo_create_map_check= 1;
}
else {
document.getElementById('gallery_map_loader'+loader).style.height = '0px';
ShowHide('gallery_map_loader'+loader,'hidden');
}
}
您可以发布一个链接到您的运行代码，以便我们可以看到完整的上下文吗？ – 2012-02-23 18:58:13
我已经添加了一些额外的代码来更好地利用它。 – David 2012-02-24 14:03:59
链接到实时代码将非常有助于解决此问题。 – andresf 2012-02-24 17:58:34