javascript 在 ASP.net C# 中使用 Google Map Geolocation API 服务
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/20372464/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
using Google Map Geolocation API Service in ASP.net C#
提问by user3026519
I want to get the user current location using Google Map Geolocation API Service and using the following code but the when i run the code it does not show the map with the location. Please give any suggestions.
我想使用 Google Map Geolocation API 服务并使用以下代码获取用户当前位置,但是当我运行代码时,它没有显示带有位置的地图。请提出任何建议。
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Get User Current Location using Google Map Geolocation API Service in asp.net website</title>
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map_canvas { height: 100% }
</style>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyC6v5-2uaq_wusHDktM9ILcqIrlPtnZgEk&sensor=false"></script>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"></script>
<script type="text/javascript">
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(success);
} else {
alert("Geo Location is not supported on your current browser!");
}
function success(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
var city = position.coords.locality;
var myLatlng = new google.maps.LatLng(latitude, longitude);
var myOptions = {
center: myLatlng,
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var marker = new google.maps.Marker({
position: myLatlng,
title: "lat: " + latitude + " long: " + longitude
});
marker.setMap(map);
var infowindow = new google.maps.InfoWindow({ content: "<b>User Address</b><br/> Latitude:" + latitude + "<br /> Longitude:" + longitude + "" });
infowindow.open(map, marker);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="map_canvas" style="width: 500px; height: 400px"></div>
</form>
</body>
</html>
回答by sabotero
I have used exactly your code and is working. Make sure when you see this message in ChromeYou click in Allow
我已经完全使用了您的代码并且正在工作。确保在Chrome 中看到此消息时 单击“允许”
If you already Deniedyour site you have to remove it from the unauthorized list (or change your port).
如果您已经拒绝了您的站点,则必须将其从未经授权的列表中删除(或更改您的端口)。
To do so:
这样做:
Go to google settings and search for Privacy:
转到谷歌设置并搜索隐私:
Click in Content settings...button and search the Location area:
单击内容设置...按钮并搜索位置区域:
Click sur Manage exceptions...button, then remove your blocked site(s) :
单击 sur管理例外...按钮,然后删除您被阻止的站点:
My result with your code is this:
我对你的代码的结果是这样的:
Your code (which I'm exactly using):
您的代码(我正在使用):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Get User Current Location using Google Map Geolocation API Service in asp.net website</title>
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map_canvas { height: 100% }
</style>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyC6v5-2uaq_wusHDktM9ILcqIrlPtnZgEk&sensor=false"></script>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"></script>
<script type="text/javascript">
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(success);
} else {
alert("Geo Location is not supported on your current browser!");
}
function success(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
var city = position.coords.locality;
var myLatlng = new google.maps.LatLng(latitude, longitude);
var myOptions = {
center: myLatlng,
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var marker = new google.maps.Marker({
position: myLatlng,
title: "lat: " + latitude + " long: " + longitude
});
marker.setMap(map);
var infowindow = new google.maps.InfoWindow({ content: "<b>User Address</b><br/> Latitude:" + latitude + "<br /> Longitude:" + longitude + "" });
infowindow.open(map, marker);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="map_canvas" style="width: 500px; height: 400px"></div>
</form>
</body>
</html>