问题1
我在输入地址后尝试获取地理位置代码。点击GeoCode按钮后，它会提示我未指定的错误。
我有一个页面Register.aspx（没有更新面板），带有一个按钮＆＃34; View＆＃34;，当我点击按钮时，它会调用ucGoogleMap.ascx。
以下是ucGoogleMap.ascx中的javascript和html代码。
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
$(document).ready(function () {
$get('<%=height.ClientID%>').value = $(window).height();
});
var geocoder = new google.maps.Geocoder();
function geocodePosition(pos) {
debugger;
geocoder.geocode({
latLng: pos
}, function (responses) {
if (responses && responses.length > 0) {
updateMarkerAddress(responses[0].formatted_address);
} else {
updateMarkerAddress('Cannot determine address at this location.');
}
});
}
function updateMarkerStatus(str) {
document.getElementById('markerStatus').innerHTML = str;
}
function updateMarkerPosition(latLng) {
document.getElementById('info').innerHTML = [
latLng.lat(),
latLng.lng()
].join(', ');
}
function updateMarkerAddress(str) {
document.getElementById('address').innerHTML = str;
}
function initialize() {
var latLng = new google.maps.LatLng(19.0606917, 72.83624970000005);
var map = new google.maps.Map(document.getElementById('mapCanvas'), {
zoom: 18,
center: latLng,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var domainName = document.getElementById('<%=hdnDomainName.ClientID %>').value;
var marker = new google.maps.Marker({
position: latLng,
title: 'Point A',
map: map,
icon: domainName + 'Images/maker.png',
draggable: true
});
// Update current position info.
updateMarkerPosition(latLng);
geocodePosition(latLng);
// Add dragging event listeners.
google.maps.event.addListener(marker, 'dragstart', function () {
updateMarkerAddress('Dragging...');
});
google.maps.event.addListener(marker, 'drag', function () {
updateMarkerStatus('Dragging...');
updateMarkerPosition(marker.getPosition());
});
google.maps.event.addListener(marker, 'dragend', function () {
updateMarkerStatus('Drag ended');
geocodePosition(marker.getPosition());
});
}
function codeAddress() {
debugger;
var domainName = document.getElementById('<%=hdnDomainName.ClientID %>').value;
var address = document.getElementById('<%= txtAddress.ClientID %>').value;
geocoder.geocode({ 'address' : address }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var map = new google.maps.Map(document.getElementById('mapCanvas'), {
zoom: 18,
center: results[0].geometry.location,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
// map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
position: results[0].geometry.location,
title: 'Point A',
map: map,
icon: domainName + 'Images/maker.png',
draggable: true
});
} else {
alert('Geocode was not successful for the following reason: ' + status);
}
// Update current position info.
updateMarkerPosition(results[0].geometry.location);
geocodePosition(results[0].geometry.location);
// Add dragging event listeners.
google.maps.event.addListener(marker, 'dragstart', function () {
updateMarkerAddress('Dragging...');
});
google.maps.event.addListener(marker, 'drag', function () {
updateMarkerStatus('Dragging...');
updateMarkerPosition(marker.getPosition());
});
google.maps.event.addListener(marker, 'dragend', function () {
updateMarkerStatus('Drag ended');
geocodePosition(marker.getPosition());
});
});
}
// Onload handler to fire off the app.
google.maps.event.addDomListener(window, 'load', initialize);
</script><style type="text/css">
#mapCanvas {
width: 500px;
height: 400px;
}
</style><asp:UpdatePanel runat="server" ID="upViewGoogleMap" UpdateMode="Conditional">
<ContentTemplate>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr class="clsTBRow" style="vertical-align: top">
<td style="width: 500px;">
<div id="mapCanvas"></div>
</td>
<td style="padding-left: 10px;">
<div id="infoPanel">
<asp:HiddenField ID="hdnDomainName" runat="server"/>
Location : <asp:TextBox ID="txtAddress" value="Rawang, Selangor" runat="server"></asp:TextBox>
<asp:Button ID="cmdGeocode" runat="server" Text="Geocode" CausesValidation="false" /><br/><br/>
<b>Marker status:</b>
<div id="markerStatus"><i>Click and drag the marker.</i></div>
<b>Current position:</b>
<div id="info"></div>
<b>Closest matching address:</b>
<div id="address"></div>
<br/>
<asp:Button ID="cmdAddPosition" runat="server" Text="Add Position" CausesValidation="false" />
</div>
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
第2期 domainName =＆＃39; http://localhost:10101/project/＆＃39; ＆lt; ---在代码后面的LOAD记录以获取当前域名
对于谷歌地图标记，我使用domainName +＆＃39; Images / maker.png＆＃39;并且标记不会显示出来。当我使用＆＃39; http://localhost:10101/project/Images/maker.png＆＃39;并且标记显示出来。
当我调试时，我检查两者的结果是否相同＆＃39; http://localhost:10101/project/Images/maker.png＆＃39;
问题3
ucGoogleMap.ascx代码背后
目前正在使用
cmdGeocode.Attributes.Add("onclick", "return codeAddress();")
我想使用下面的代码来调用javascript，但它看起来并不像它的功能。
Protected Sub cmdGeocode_Click(sender As Object, e As EventArgs) Handles cmdGeocode.Click
Page.ClientScript.RegisterClientScriptBlock(Me.GetType, "codeAddress", "codeAddress();", True)
upViewGoogleMap.Update()
End Sub
答案 0 :(得分：0)
我已经通过在javascript中添加此代码解决了第1期未指定的错误。
HTMLElement.prototype.getBoundingClientRect = (function () {
var oldGetBoundingClientRect = HTMLElement.prototype.getBoundingClientRect;
return function () {
try {
return oldGetBoundingClientRect.apply(this, arguments);
} catch (e) {
return {
left: '',
right: '',
top: '',
bottom: ''
};
}
};
})();
对于问题3，我使用ScriptManager.RegisterStartupScript而不是ClientScript更改了代码.RegisterClientScriptBlock