Asp.net使用javascript，我从谷歌地图中取出了如何将数据保存到数据库中 [英] Asp.net using javascript, I have taken from Google maps how to save data to the database
本文介绍了Asp.net使用javascript，我从谷歌地图中取出了如何将数据保存到数据库中的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
< html xmlns = http：/ /www.w3.org/1999/xhtml\">
< head runat = server >
< title > < / title >
#mapContainer {
height：500px;
宽度：800px;
border：10px solid #eaeaea;
}
< script src = https ：//maps.googleapis.com/maps/api/js？key = AIzaSyDX1D37MapC2HfewVE0T3MXcUT4bstvHq8& callback = initMap type = text / javascript > < / script >
< script src = http://maps.google.com/maps/api/js?senso r = false > < / script >
< script src = https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min。 js > < / script >
< script type = text / javascript >
var geocoder;
if （ navigator .geolocation）{
navigator .geolocation.getCurrentPosition（successFunction，errorFunction）;
}
// 获取纬度和经度;
function successFunction（position）{
var lat = position.coords.latitude;
var lng = position.coords.longitude;
codeLatLng（lat，lng）
}
function errorFunction（）{
alert（ 地理编码器失败）;
}
function initialize（）{
geocoder = new google.maps.Geocoder（）;
}
function codeLatLng（lat，lng）{
var latlng = new google.maps.LatLng（lat，lng）;
var mapOptions = {
zoom： 15 ，
center： latlng，
mapTypeControl： true ，
navigationControlOptions：
{
style：google.maps.NavigationControlStyle.SMALL
}，
mapTypeId：google.maps.MapTypeId.ROADMAP
};
map = new google.maps。地图（
document .getElementById（ mapContainer），mapOptions
）;
geocoder.geocode（{' latLng'：latlng}， function （结果，状态）{
if （status == google.maps.GeocoderStatus.OK）{
console .log（results）
if （结果[ 1 ]）{
// 格式化地址
alert（结果[ 0 ] .metated_address）
// 查找国家/地区名称
（ var i = 0 ; i< results [ 0 ] address_components.length; i ++）{
for （ var b = 0 ; b< results [ 0 ]。address_components [i] .types.length; b ++）{
// 有不同的类型可以容纳一个城市admin_area_lvl_1通常会在寻找sublocality类型的情况下更合适
if （结果[ 0 ]。address_components [i] .types [b] == administrative_area_level_1）{
// 这是您要查找的对象</ span>
city = results [ 0 ]。addre ss_components [I];
break ;
}
}
}
// 城市数据
alert（city.short_name + + city.long_name）
}
else {
alert（ 未找到结果）;
}
}
其他 {
alert（ 地理编码器因以下原因失败： + status）;
}
var marker = new google.maps.Marker（{
position：latlng，
map：map，
title： 你的位置
}）;
}）;
}
< / 脚本 >
< / head >
< body >
< 表格 id = form1 runat = 服务器 >
< / form >
< / body >
< / html >
我尝试了什么：
2-3小时，我正在寻找互联网，我尝试，但我没有得到结果。我正在尝试另一个代码块，纬度和经度可以保存数据库。这不仅仅是我想要的，我想保存城市格式化的地址
（我的英语不是很好。如果我错了，我道歉:)）
解决方案
你可以从javascript调用asp.net页面方法（WebMethod）。将详细信息作为参数传递给Web方法，并将数据库保存在后面的代码中。
遵循以下教程：
使用C＃和VB.Net在ASP.Net中使用JavaScript调用WebMethod [ ^
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
#mapContainer {
height: 500px;
width: 800px;
border: 10px solid #eaeaea;
}
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDX1D37MapC2HfewVE0T3MXcUT4bstvHq8&callback=initMap" type="text/javascript"></script>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
var geocoder;
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(successFunction, errorFunction);
}
//Get the latitude and the longitude;
function successFunction(position) {
var lat = position.coords.latitude;
var lng = position.coords.longitude;
codeLatLng(lat, lng)
}
function errorFunction() {
alert("Geocoder failed");
}
function initialize() {
geocoder = new google.maps.Geocoder();
}
function codeLatLng(lat, lng) {
var latlng = new google.maps.LatLng(lat, lng);
var mapOptions = {
zoom: 15,
center: latlng,
mapTypeControl: true,
navigationControlOptions:
{
style: google.maps.NavigationControlStyle.SMALL
},
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(
document.getElementById("mapContainer"), mapOptions
);
geocoder.geocode({ 'latLng': latlng }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
console.log(results)
if (results[1]) {
//formatted address
alert(results[0].formatted_address)
//find country name
for (var i = 0; i < results[0].address_components.length; i++) {
for (var b = 0; b < results[0].address_components[i].types.length; b++) {
//there are different types that might hold a city admin_area_lvl_1 usually does in come cases looking for sublocality type will be more appropriate
if (results[0].address_components[i].types[b] == "administrative_area_level_1") {
//this is the object you are looking for
city = results[0].address_components[i];
break;
}
}
}
// city data
alert(city.short_name + " " + city.long_name)
}
else {
alert("No results found");
}
}
else {
alert("Geocoder failed due to: " + status);
}
var marker = new google.maps.Marker({
position: latlng,
map: map,
title: "Your Location"
});
});
}
</script>
</head>
<body >
<form id="form1" runat="server">
</form>
</body>
</html>
What I have tried:
2-3 hours, I'm looking on the internet and I try, but I did not get results. I'm trying another code block, latitude and longitude can save the database. This is not just what I wanted, and I want to save the city formatted address
(My English is not very good.I apologize if I am wrong :) )
解决方案
you can call asp.net page method(WebMethod) from javascript. pass the details as parameters to web method and do the database save in the code behind.
follow below tutorial:
Call WebMethod from JavaScript with parameters in ASP.Net using C# and VB.Net[^]
这篇关于Asp.net使用javascript，我从谷歌地图中取出了如何将数据保存到数据库中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
