省市区三级联动传值名称+省市区腾讯地图定位+经纬度定位_腾讯地图如何查询上一级城市资源-CSDN文库

共4个文件

js：3个

html：1个

4星 · 超过85%的资源需积分: 5 187 浏览量 2014-12-02 15:12:40 上传评论 5 收藏 68KB ZIP 举报

在IT行业中，省市区三级联动通常用于地理信息系统（GIS）或者地图应用中，提供用户一个方便的方式来选择他们的地理位置。这种联动意味着当用户在一个级别（如省份）选择一个选项时，下一级别（如城市）会根据所选的省份自动更新其可选项，再下一级（如区县）则根据选定的城市更新。这种设计可以提高用户体验，减少输入错误，并确保数据的准确性。在这个特定的项目中，"省市区三级联动传值名称"指的是在用户选择了一个街道的具体地址后，系统会将省、市、区这三个级别的名称作为参数传递给后台，而不是它们的代号或ID。这样做的好处是，对于非技术用户来说，名称更容易理解，同时也方便了数据的直观展示和分析。 "腾讯地图定位"是一个集成在应用中的功能，允许用户在腾讯地图上查看和定位他们的位置。用户可以通过搜索街道地址或者直接在地图上点击来定位。一旦定位成功，地图应用将显示用户的经纬度坐标。经纬度是地球上位置的常用坐标系统，经度代表东西方向的位置，纬度表示南北方向的位置。 "经纬度定位"是通过获取地图上的点击位置来确定地理坐标的过程。在GIS中，经纬度坐标是重要的定位信息，因为它们能精确地表示地球上任何一点的位置。一旦获取了经纬度，就可以进行各种与位置相关的操作，比如导航、距离计算、区域划分等。在这个压缩包文件"location"中，可能包含了实现这些功能的相关代码、配置文件或示例数据。可能有JavaScript或PHP等编程语言的文件，用于处理省市区联动的逻辑，以及与腾讯地图API的交互。还有可能是数据库配置，用于存储省市区的数据，以及处理从地图返回的经纬度信息。这些文件的详细分析和使用需要对相关技术和编程有一定了解，才能正确集成到项目中。这个项目涉及了前端的用户界面交互、后端的数据处理以及地图服务的集成，是构建地理信息系统中的关键部分。开发者需要掌握HTML、CSS、JavaScript等前端技术，以及可能的后端语言（如PHP或Python），还需要熟悉腾讯地图API的使用，以便实现上述功能。同时，理解数据库管理和地理编码的概念也是必要的。

资源推荐

资源详情

资源评论

收起资源包目录

location.zip （4个子文件）

location

AreaData_min.js 143KB

jquery-1.7.min.js 92KB

Area.js 3KB

addlocation.html 7KB

<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="js/Area.js"></script> <script type="text/javascript" src="js/AreaData_min.js"></script> <script type="text/javascript" src="js/jquery-1.7.min.js"></script> <script charset="utf-8" src="http://map.qq.com/api/js?v=1"></script> <title>添加门店</title> <script type="text/javascript"> $(function (){ initComplexArea('seachprov', 'seachcity', 'seachdistrict', area_array, sub_array, '41', '0', '0'); }); //得到地区码 function getAreaID(){ var area = 0; if($("#seachdistrict").val() != "0"){ area = $("#seachdistrict").val(); }else if ($("#seachcity").val() != "0"){ area = $("#seachcity").val(); }else{ area = $("#seachprov").val(); } return area; } //根据地区码查询地区名 function getAreaNamebyID(areaID){ var areaName = ""; if(areaID.length == 2){ areaName = area_array[areaID]; $("#province").val(area_array[areaID]); }else if(areaID.length == 4){ var index1 = areaID.substring(0, 2); areaName = area_array[index1] + " " + sub_array[index1][areaID]; $("#province").val(area_array[index1]); $("#city").val(sub_array[index1][areaID]); }else if(areaID.length == 6){ var index1 = areaID.substring(0, 2); var index2 = areaID.substring(0, 4); areaName = area_array[index1] + " " + sub_array[index1][index2] + " " + sub_arr[index2][areaID]; $("#province").val(area_array[index1]); $("#city").val(sub_array[index1][index2]); $("#district").val(sub_arr[index2][areaID]); } return areaName; } var geocoder,map,marker = null; var init = function() { var center = new soso.maps.LatLng(34.754504,113.706663); map = new soso.maps.Map(document.getElementById('container'),{ center: center, zoomLevel: 15 }); geocoder = new soso.maps.Geocoder(); var label; map.setCursor("default"); soso.maps.Event.addListener(map,"mousedown",function(){ map.setCursor("default"); }); //绑定点击事件 soso.maps.Event.addListener(map,"click",function(){ $("#longitude").val($("#longitude1").val()); $("#latitude").val($("#latitude1").val()); }); //给map绑定mousemove事件 soso.maps.Event.addListener(map,"mousemove",function(e){ var gl=e.latLng; if(!label){ label=new soso.maps.Label({ map:map, position:gl }); }else{ label.setContent( gl.getLat().toFixed(6)+","+gl.getLng().toFixed(6) ) } setLabelPoi(label,gl); }); soso.maps.Event.addListener(map,"mouseout",function(e){ label&&label.setMap(null); }); function setLabelPoi(lab,latlng){ lab.setMap(map); //根据地理坐标获取相对地图容器的像素坐标。 var point=map.fromLatLngToContainerPixel(latlng); var pointN=new soso.maps.Point( point.getX()+15, point.getY()+30 ); //根据相对地图容器的像素坐标获取地理坐标。 var gl=map.fromContainerPixelToLatLng(pointN); lab.setPosition(gl); lab.setContent( latlng.getLat().toFixed(6)+","+latlng.getLng().toFixed(6) ); $("#longitude1").val(latlng.getLat().toFixed(6)); $("#latitude1").val(latlng.getLng().toFixed(6)); }; } function codeAddress() { var address = getAreaNamebyID(getAreaID())+$("#address").val(); geocoder.geocode({'address': address}, function(results, status) { if (status == soso.maps.GeocoderStatus.OK) { map.setCenter(results.location); if (marker != null) { marker.setMap(null); } marker = new soso.maps.Marker({ map: map, position:results.location }); } else { alert("检索没有结果，原因: " + status); } }); } </script> <style type="text/css"> .header { height:50px; border-bottom:#999 solid; border-width:1px} A {text-decoration: NONE; font-weight:bold; color:#03F} </style> </head> <body onload="init()"> <div style="margin-top:20px; width:70%; margin:20px auto"> </div> <div style="width:60%; margin:0 auto;"> <form method="post" action="" > <input type="hidden" id="longitude1"/> <input type="hidden" id="latitude1"/> <table width="100%" border="0" cellpadding="4" cellspacing="0" bgcolor="#FFFFFF" > <tr> <td height="30" align="right" bgcolor="#FFFFFF" style=" border-bottom:1px #CCCCCC dashed">地址：</td> <td bgcolor="#FFFFFF" style=" border-bottom:1px #CCCCCC dashed"> <select id="seachprov" onChange="changeComplexProvince(this.value, sub_array, 'seachcity', 'seachdistrict');"></select>   <select id="seachcity" onChange="changeCity(this.value,'seachdistrict','seachdistrict');"></select>   <span id="seachdistrict_div"> <select id="seachdistrict"></select> </span> <input id="province" type="hidden" name="province"> <input id="city" type="hidden" name="city"> <input id="district" type="hidden" name="district"> </td> </tr> <tr> <td width="100" height="30" align="right" bgcolor="#FFFFFF" style=" border-bottom:1px #CCCCCC dashed">街道地址：</td> <td bgcolor="#FFFFFF" style=" border-bottom:1px #CCCCCC dashed" class="link_lan"> <input name="address" type="text" id="address" value=""/> <input type="button" onclick="codeAddress()" value="定位"/> </td> </tr> <tr> <td height="30" align="right" bgcolor="#FFFFFF" style=" border-bottom:1px #CCCCCC dashed">经度：</td> <td bgcolor="#FFFFFF" style=" border-bottom:1px #CCCCCC dashed"> <input name="longitude" type="text" id="longitude" value="" readonly="readonly"/><span style=" font-size:0.8em">（点击地图定位经度）</span> </td> </tr> <tr> <td height="30" align="right" bgcolor="#FFFFFF" style=" border-bottom:1px #CCCCCC dashed">纬度：</td> <td bgcolor="#FFFFFF" style=" border-bottom:1px #CCCCCC dashed"> <input name="latitude" type="text" id="latitude" value="" readonly="readonly"/><span style=" font-size:0.8em">（点击地图定位纬度）</span> </td> </tr> <tr> <td height="30" align="right" bgcolor="#FFFFFF" style=" border-bottom:1px #CCCCCC dashed">位置：</td> <td bgcolor="#FFFFFF" style=" border-bottom:1px #CCCCCC dashed"> <div id="container" style="width:500px; height:400px"></div> </td> </tr> <tr> <td height="30" align="right" > </td> <td height="50" > <input name="submit" type="submit" class="admin_submit" value="提交" onclick ="return valid();"/> </td> </tr> </table> </form> </div> </script> </body> </html>

评论收藏

内容反馈