离线地图解决方案：地图地物查询
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了离线地图解决方案：地图地物查询相关的知识，希望对你有一定的参考价值。
续上一篇，用户除有地物搜索（任意输入关键字，查询包含该关键字的地物）外，也有精确查询的需求，如查询指定经纬度周边一定范围内的地物，通过地图上框选矩形或者多边形，查询矩形或者多边形内的地物等。
范围查询：查询指定经纬度周边一定距离内的地物，效果如下图所示：
矩形框选查询：查询包含在指定矩形内的地物
多边形框选查询：在地图上绘制多边形，并查询包含在多边形内的地物
代码：
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <style> html, body { width: 100%; height: 100%; overflow: hidden; margin: 0; font-family: "微软雅黑"; } </style> <script src="js/jquery-1.11.2.min.js" type="text/javascript"></script> <script type="text/javascript" src="plugin/ol3/build/ol-debug.js"></script> <script type="text/javascript" src="js/Config.js"></script> <script type="text/javascript" src="js/PrivateFunction.js"></script> </head> <body> <div id="topHead" style=" height:65px; float:none;width:100%;border:0px solid gray"> <table id="bjTable" style="height:100%;width:100%;"> <tr> <td style="width:85px" align="right">圆心,经度：</td> <td style="width:100px"><input id="txtjd" /></td> <td style="width:60px" align="right">纬度：</td> <td style="width:100px"><input id="txtwd" /></td> <td style="width:60px" align="right">周围：</td> <td style="width:100px" align="right"><input style="width:75px;" id="txtZWjl"/>米</td> <td style="width:70px" align="right"><button style="width:65px" onclick="OpenCJ();">画圆</button></td> <td style="width:70px"><button style="width:65px" onclick="GetServerData()">搜索</button></td> <td style="width:60px" align="right">结果：</td> <td style="width:180px"><select id="resultList" style="width:200px"></select></td> <td></td> </tr> </table> </div> <div id="div_gis" style="float:none;width:100%;height:100%;border:0px solid gray"> </div> </body> </html> <script type="text/javascript"> LoadGoogleTileMap(1, ‘div_gis‘, 1, 12, 8, 103.964571, 30.245677); CreateVectorLayer(); OpenMap.on(‘click‘, function (evt) { var coordinate = evt.coordinate; txtjd.value = coordinate[0]; txtwd.value = coordinate[1]; }); function GetServerData() { $.ajax({ url: ‘http://localhost:8899/api/ReverseGEOApi/SearchPointBytype‘, //请求地址 type: ‘Get‘, //请求方式为post data: { ‘x‘: txtjd.value, ‘y‘: txtwd.value, ‘PointType‘: 1, ‘MiDis‘: txtZWjl.value, ‘pointCount‘: 5 }, //传入参数 dataType: ‘json‘, //返回数据格式 //请求成功完成后要执行的方法 success: showRegCallBack, error: function (err) { alert("执行失败"); } }); } function showRegCallBack(data) { for (var i = 0; i < data.data.length; i++) { addPoint(data.data[i].PnameTemp, i + 1, data.data[i]NaN.X, data.data[i]NaN.Y); } } function addPoint(nameStr, id, xx, yy) { var pointStyle = CreatePointStyle(‘#ff0000‘, ‘10‘, ‘#ff0000‘, ‘2‘, nameStr, ‘center‘, ‘middle‘, ‘Arial‘, ‘14‘, ‘normal‘, ‘#aa3300‘, ‘#ffcc33‘, ‘2‘, ‘0‘, ‘15‘, ‘0‘); AddPointToLayer(tempDrawSoure, id, xx, yy, pointStyle); } </script>
本文出自 “开源GIS离线地图” 博客，请务必保留此出处http://cdguiyi.blog.51cto.com/4275617/1916461
以上是关于离线地图解决方案：地图地物查询的主要内容，如果未能解决你的问题，请参考以下文章