<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm12.aspx.cs" Inherits="JSONFromCS.WebForm12" %><!DOCTYPE><html><head runat="server"><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>高德地图 API Javascript API</title> <link rel="stylesheet" type="text/CSS" href="http://developer.amap.com/Public/css/demo.Default.css" /> <script language="javascript" type="text/javascript" src="http://webapi.amap.com/maps?v=1.2&key=7aeb3377f9e53d9bf0c558bf8e821f76"></script> <script language="javascript" type="text/javascript"> //http://developer.amap.com/javascript/example/num/1103var mapObj; var marker = new Array(); var windowsArr = new Array(); //基本地图加载 function mapInit(){ mapObj = new AMap.Map("iCenter"); } //地点查询函数 function placeSearch(){ mapObj.clearMap(); var arr = new Array(); var MSearch; //绘制矩形边框 arr.push(new AMap.LngLat("116.423321","39.884055")); arr.push(new AMap.LngLat("116.473103","39.884055")); arr.push(new AMap.LngLat("116.473103","39.919348")); arr.push(new AMap.LngLat("116.423321","39.919348")); var polygon = new AMap.Polygon({ map:mapObj, path:arr, strokeColor:"#0000ff", strokeOpacity:0.2, strokeWeight:3, fillColor: "#f5deb3", fillOpacity: 0.8 }); mapObj.plugin(["AMap.PlaceSearch"], function() { //加载PlaceSearch服务插件 MSearch = new AMap.PlaceSearch({ pageSize: 8 }); //构造地点查询类 AMap.event.addListener(MSearch, "complete", placeSearch_CallBack); //查询成功时的回调函数 MSearch.searchInBounds("酒店", new AMap.Bounds(arr[0], arr[2])); //范围查询 }); } //添加marker和infowindow function addmarker(i, d){ var lngX = d.location.getLng(); var latY = d.location.getLat(); var markerOption = { map:mapObj, icon:"http://webapi.amap.com/images/"+(i+1)+".png", position:new AMap.LngLat(lngX, latY) }; var mar =new AMap.Marker(markerOption); marker.push(new AMap.LngLat(lngX, latY)); var infoWindow = new AMap.InfoWindow({ content:"<h3><font color=/"#00a6ac/">"+(i+1) + "."+ d.name +"</h3></font>"+TipContents(d.type, d.address, d.tel), size:new AMap.Size(300, 0), autoMove:true, offset:new AMap.Pixel(0,-30) }); windowsArr.push(infoWindow); var aa = function(){infoWindow.open(mapObj, mar.getPosition());}; AMap.event.addListener(mar, "click", aa); } //地点查询回调函数 function placeSearch_CallBack(data){ var resultStr=""; var resultArr = data.poiList.pois; var resultNum = resultArr.length; for (var i = 0; i < resultNum; i++) { resultStr += "<div id='divid"+(i+1)+"' onmouSEOver='openMarkerTipById1("+i+",this)' onmouseout='onmouseout_MarkerStyle("+(i+1)+",this)' style=/"font-size: 12px;cursor:pointer;padding:2px 0 4px 2px; border-bottom:1px solid #C1FFC1;/"><table><tr><td><img src=/"http://webapi.amap.com/images/"+(i+1)+".png/"></td>"+"<td><h3><font color=/"#00a6ac/">名称: "+resultArr[i].name+"</font></h3>"; resultStr += TipContents(resultArr[i].type, resultArr[i].address, resultArr[i].tel)+"</td></tr></table></div>"; addmarker(i, resultArr[i]); } mapObj.setFitView(); document.getElementById("result").innerHTML = resultStr; } function TipContents(type,address,tel){ //窗体内容 if (type == "" || type == "undefined" || type == null || type == " undefined" || typeof type == "undefined") { type = "暂无"; } if (address == "" || address == "undefined" || address == null || address == " undefined" || typeof address == "undefined") { address = "暂无"; } if (tel == "" || tel == "undefined" || tel == null || tel == " undefined" || typeof address == "tel") { tel = "暂无"; } var str ="地址：" + address + "<br />电话：" + tel + " <br />类型："+type; return str; } function openMarkerTipById1(pointid,thiss){ //根据id打开搜索结果点tip thiss.style.background='#CAE1FF'; windowsArr[pointid].open(mapObj, marker[pointid]); } function onmouseout_MarkerStyle(pointid,thiss) { //鼠标移开后点样式恢复 thiss.style.background=""; } </script> </head><body onload="mapInit();"><div id="iCenter"></div> <div class="demo_box"> <p><input type="button" value="查询" onclick="placeSearch()"/><br /> </p> <div id="r_title"><b>范围内查询结果:</b></div> <div id="result"> </div> </div> <form id="form1" runat="server"> <div> </div> </form> <!-- JiaThis Button BEGIN --><script type="text/javascript" src="http://v3.jiathis.com/code/jiathis_r.js?uid=1363823158283538&type=left&move=0&btn=l5.gif" charset="utf-8"></script><!-- JiaThis Button END --></body></html>
新闻热点
疑难解答
