百度地图GeoUtils示例

2019-11-25 17:37:01

参考示例 百度地图GeoUtils示例

简介

百度地图JavaScript开源库,是一套基于百度地图API二次开发的开源的代码库。目前提供多个lib库,帮助开发者快速实现在地图上添加Marker、自定义信息窗口、标注相关开发、区域限制设置、几何运算、实时交通、检索与公交驾车查询、鼠标绘制工具等功能。

几何运算

GeoUtils类提供若干几何算法,用来帮助用户判断点与矩形、 圆形、多边形线、多边形面的关系,并提供计算折线长度和多边形的面积的公式。 主入口类是GeoUtils

GeoUtils.html

<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><title>GeoUtils示例</title><script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script><script type="text/javascript" src="http://api.map.baidu.com/library/GeoUtils/1.2/src/GeoUtils_min.js"></script><style type="text/css">
        table{            font-size:14px;        }</style></head><body><div style="float:left;width:600px;height:500px;border:1px solid gray" id="container"></div><div style="float:left;width:300px;height:500px;border:1px solid gray" id="control">
    <table style="width:100%;">
    <tr>
        <td colspan="2">
            点与矩形的关系:        </td>
    </tr>
    <tr>
        <td>
            <input type="button" value="点在矩形内" onclick="ptInRect()"/>
        </td>
        <td>
            <input type="button" value="点在矩形外" onclick="ptOutRect()"/>
        </td>
    </tr>
    <tr>
        <td>
            <br/>
        </td>
    </tr>
    <tr>
        <td colspan="2">
            点与圆形的关系:        </td>
    </tr>
    <tr>
        <td>
            <input type="button" value="点在圆形内" onclick="ptInCircle()"/>
        </td>
        <td>
            <input type="button" value="点在圆形外" onclick="ptOutCircle()"/>
        </td>
    </tr>
    <tr>
        <td>
            <br/>
        </td>
    </tr>
    <tr>
        <td colspan="2">
            计算折线长度:        </td>
    </tr>
    <tr>
        <td>
            <input type="button" value="参数为折线" onclick="computeLenByPolyine()"/>
        </td>
        <td>
            <input type="button" value="参数为点数组" onclick="computeLenByArray()"/>
        </td>
    </tr>
    <tr>
        <td>
            <br/>
        </td>
    </tr>
    <tr>
        <td colspan="2">
            计算多边形面积:        </td>
    </tr>
    <tr>
        <td>
            <input type="button" value="参数为多边形" onclick="computeAreaByPolygon()"/>
        </td>
        <td>
            <input type="button" value="参数为点数组" onclick="computeAreaByArray()"/>
        </td>
    </tr>
    <tr>
        <td>
            <br/>
        </td>
    </tr>
    <tr>
        <td colspan="2">
            判断点是否在折线上:        </td>
    </tr>
    <tr>
        <td>
            <input type="button" value="点在折线上" onclick="ptOnPolyline()"/>
        </td>
        <td>
            <input type="button" value="点在折线外" onclick="ptOutPolyline()"/>
        </td>
    </tr>
    <tr>
        <td>
            <br/>
        </td>
    </tr>
    <tr>
        <td colspan="2">
            判断点是否在多边形内:        </td>
    </tr>
    <tr>
        <td>
            <input type="button" value="点在多边形内" onclick="ptInPolygon()"/>
        </td>
        <td>
            <input type="button" value="点在多边形外" onclick="ptOutPolygon()"/>
        </td>
    </tr>
    </table></div></body></html><script type="text/javascript">
    var map = new BMap.Map("container");    var pt = new BMap.Point(116.404, 39.915);
    map.centerAndZoom(pt, 16);
    map.enableScrollWheelZoom();//开启滚动缩放
    map.enableContinuousZoom();//开启缩放平滑
    //点在矩形内
    function ptInRect(){
        var pt = new BMap.Point(116.404, 39.915);//测试点
        var pt1 = new BMap.Point(116.400, 39.910);//西南脚点
        var pt2 = new BMap.Point(116.410, 39.920);//东北脚点
        var bds = new BMap.Bounds(pt1, pt2); //测试Bounds对象
        var result = BMapLib.GeoUtils.isPointInRect(pt, bds);        if(result == true){
            alert("点在矩形内");
        } else {
            alert("点在矩形外")
        }        //演示:将点与矩形添加到地图上
        map.clearOverlays();        var mkr = new BMap.Marker(pt);        var pts = [];        //bds的四个脚点坐标
        var leftTop = new BMap.Point(pt1.lng, pt2.lat);        var rightTop = new BMap.Point(pt2.lng, pt2.lat);        var leftBottom = new BMap.Point(pt1.lng, pt1.lat);        var rightBottom = new BMap.Point(pt2.lng, pt1.lat);
        pts.push(leftTop);
        pts.push(rightTop);
        pts.push(rightBottom);
        pts.push(leftBottom);        var rect = new BMap.Polygon(pts);
        map.addOverlay(mkr);//添加测试点
        map.addOverlay(rect);//添加测试矩形
    }    //点在矩形外
    function ptOutRect(){
        var pt = new BMap.Point(116.398, 39.915);//测试点
        var pt1 = new BMap.Point(116.400, 39.910);//西南脚点
        var pt2 = new BMap.Point(116.410, 39.920);//东北脚点
        var bds = new BMap.Bounds(pt1, pt2); //测试Bounds对象
        var result = BMapLib.GeoUtils.isPointInRect(pt, bds);        if(result == true){
            alert("点在矩形内");
        } else {
            alert("点在矩形外")
        }        //演示:将点与矩形添加到地图上
        map.clearOverlays();        var mkr = new BMap.Marker(pt);        var pts = [];        //bds的四个脚点坐标
        var leftTop = new BMap.Point(pt1.lng, pt2.lat);        var rightTop = new BMap.Point(pt2.lng, pt2.lat);        var leftBottom = new BMap.Point(pt1.lng, pt1.lat);        var rightBottom = new BMap.Point(pt2.lng, pt1.lat);
        pts.push(leftTop);
        pts.push(rightTop);
        pts.push(rightBottom);
        pts.push(leftBottom);        var rect = new BMap.Polygon(pts);
        map.addOverlay(mkr);//添加测试点
        map.addOverlay(rect);//添加测试矩形
    }    //点在圆内
    function ptInCircle(){
        var pt = new BMap.Point(116.404, 39.915);//测试点
        var c = new BMap.Point(116.404, 39.915); //圆心
        var circle = new BMap.Circle(c, 500);//测试圆
        var result = BMapLib.GeoUtils.isPointInCircle(pt, circle);        if(result == true){
            alert("点在圆形内");
        } else {
            alert("点在圆形外")
        }        //演示:将点与圆形添加到地图上
        map.clearOverlays();        var mkr = new BMap.Marker(pt);
        map.addOverlay(mkr);
        map.addOverlay(circle);
    }    //点在圆外
    function ptOutCircle(){
        var pt = new BMap.Point(116.396, 39.915);//测试点
        var c = new BMap.Point(116.404, 39.915); //圆心
        var circle = new BMap.Circle(c, 500);//测试圆
        var result = BMapLib.GeoUtils.isPointInCircle(pt, circle);        if(result == true){
            alert("点在圆形内");
        } else {
            alert("点在圆形外")
        }        //演示:将点与圆形添加到地图上
        map.clearOverlays();        var mkr = new BMap.Marker(pt);
        map.addOverlay(mkr);
        map.addOverlay(circle);
    }    //计算长度,参数为折线
    function computeLenByPolyine(){
        var pts = [];        var pt1 = new BMap.Point(116.400,39.910);        var pt2 = new BMap.Point(116.402,39.912);        var pt3 = new BMap.Point(116.403,39.914);        var pt4 = new BMap.Point(116.404,39.917);        var pt5 = new BMap.Point(116.406,39.918);
        pts.push(pt1);
        pts.push(pt2);
        pts.push(pt3);
        pts.push(pt4);
        pts.push(pt5);        var ply = new BMap.Polyline(pts);        var dis = BMapLib.GeoUtils.getPolylineDistance(ply);
        alert("共" + dis.toFixed(2) + "米");        //演示:将线添加到地图上
        map.clearOverlays();
        map.addOverlay(ply);
    }    //计算长度,参数为点数组
    function computeLenByArray(){
        var pts = [];        var pt1 = new BMap.Point(116.400,39.910);        var pt2 = new BMap.Point(116.402,39.912);        var pt3 = new BMap.Point(116.403,39.914);        var pt4 = new BMap.Point(116.404,39.917);        var pt5 = new BMap.Point(116.406,39.918);
        pts.push(pt1);
        pts.push(pt2);
        pts.push(pt3);
        pts.push(pt4);
        pts.push(pt5);        var dis = BMapLib.GeoUtils.getPolylineDistance(pts);
        alert("共" + dis.toFixed(2) + "米");        //演示:将线添加到地图上
        var ply = new BMap.Polyline(pts, {strokeColor: "red", strokeStyle:"dashed"});
        map.clearOverlays();
        map.addOverlay(ply);
    }    //计算面积,参数为多边形
    function computeAreaByPolygon(){
        var pts = [];        var pt1 = new BMap.Point(116.395, 39.910);        var pt2 = new BMap.Point(116.394, 39.918);        var pt3 = new BMap.Point(116.396, 39.919);        var pt4 = new BMap.Point(116.404, 39.920);        var pt5 = new BMap.Point(116.406, 39.913);
        pts.push(pt1);
        pts.push(pt2);
        pts.push(pt3);
        pts.push(pt4);
        pts.push(pt5);        var ply = new BMap.Polygon(pts);        var area = BMapLib.GeoUtils.getPolygonArea(ply);
        alert("共" + area.toFixed(2) + "平方米");        //演示:将面添加到地图上
        map.clearOverlays();
        map.addOverlay(ply);
    }    //计算面积,参数为数组
    function computeAreaByArray(){
        var pts = [];        var pt1 = new BMap.Point(116.395, 39.910);        var pt2 = new BMap.Point(116.394, 39.918);        var pt3 = new BMap.Point(116.396, 39.919);        var pt4 = new BMap.Point(116.404, 39.920);        var pt5 = new BMap.Point(116.406, 39.913);
        pts.push(pt1);
        pts.push(pt2);
        pts.push(pt3);
        pts.push(pt4);
        pts.push(pt5);        var area = BMapLib.GeoUtils.getPolygonArea(pts);
        alert("共" + area.toFixed(2) + "平方米");        //演示:将面添加到地图上
        var ply = new BMap.Polygon(pts, {strokeColor: "red", strokeStyle:"dashed", fillColor:"gray"});
        map.clearOverlays();
        map.addOverlay(ply);
    }    //点在折线上
    function ptOnPolyline(){
        var pts = [];        var pt1 = new BMap.Point(116.395, 39.910);        var pt2 = new BMap.Point(116.405, 39.920);        var pt3 = new BMap.Point(116.410, 39.920);
        pts.push(pt1);
        pts.push(pt2);
        pts.push(pt3);        var ply = new BMap.Polyline(pts);        var pt = new BMap.Point(116.400, 39.915);        var result = BMapLib.GeoUtils.isPointOnPolyline(pt, ply);        if(result == true){
            alert("点在折线上");
        } else {
            alert("点在折线外")
        }
        map.clearOverlays();        var mkr = new BMap.Marker(pt);
        map.addOverlay(mkr);
        map.addOverlay(ply);
    }    //点在折线外
    function ptOutPolyline(){
        var pts = [];        var pt1 = new BMap.Point(116.395, 39.910);        var pt2 = new BMap.Point(116.405, 39.920);        var pt3 = new BMap.Point(116.410, 39.920);
        pts.push(pt1);
        pts.push(pt2);
        pts.push(pt3);        var ply = new BMap.Polyline(pts);        var pt = new BMap.Point(116.401, 39.915);        var result = BMapLib.GeoUtils.isPointOnPolyline(pt, ply);        if(result == true){
            alert("点在折线上");
        } else {
            alert("点在折线外")
        }
        map.clearOverlays();        var mkr = new BMap.Marker(pt);
        map.addOverlay(mkr);
        map.addOverlay(ply);
    }    //点在多边形内
    function ptInPolygon(){
        var pts = [];        var pt1 = new BMap.Point(116.395, 39.910);        var pt2 = new BMap.Point(116.394, 39.914);        var pt3 = new BMap.Point(116.403, 39.920);        var pt4 = new BMap.Point(116.402, 39.914);        var pt5 = new BMap.Point(116.410, 39.913);
        pts.push(pt1);
        pts.push(pt2);
        pts.push(pt3);
        pts.push(pt4);
        pts.push(pt5);        var ply = new BMap.Polygon(pts);        var pt =new BMap.Point(116.400, 39.914);        var result = BMapLib.GeoUtils.isPointInPolygon(pt, ply);        if(result == true){
            alert("点在多边形内");
        } else {
            alert("点在多边形外")
        }        //演示:将面添加到地图上
        map.clearOverlays();        var mkr = new BMap.Marker(pt);
        map.addOverlay(mkr);
        map.addOverlay(ply);
    }    //点在多边形外
    function ptOutPolygon(){
        var pts = [];        var pt1 = new BMap.Point(116.395, 39.910);        var pt2 = new BMap.Point(116.394, 39.914);        var pt3 = new BMap.Point(116.396, 39.919);        var pt4 = new BMap.Point(116.406, 39.920);        var pt5 = new BMap.Point(116.410, 39.913);
        pts.push(pt1);
        pts.push(pt2);
        pts.push(pt3);
        pts.push(pt4);
        pts.push(pt5);        var ply = new BMap.Polygon(pts);        var pt =new BMap.Point(116.410, 39.915);        var result = BMapLib.GeoUtils.isPointInPolygon(pt, ply);        if(result == true){
            alert("点在多边形内");
        } else {
            alert("点在多边形外")
        }        //演示:将面添加到地图上
        map.clearOverlays();        var mkr = new BMap.Marker(pt);
        map.addOverlay(mkr);
        map.addOverlay(ply);
    }</script>123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401

运行效果如图:

这里写图片描述

这里写图片描述


  • 2019-03-26 19:29:05

    Android NDK开发Crash错误定位

     在Android开发中,程序Crash分三种情况:未捕获的异常、ANR(Application Not Responding)和闪退(NDK引发错误)。其中未捕获的异常根据logcat打印的堆栈信息很容易定位错误。ANR错误也好查,Android规定,应用与用户进行交互时,如果5秒内没有响应用户的操作,则会引发ANR错误,并弹出一个系统提示框,让用户选择继续等待或立即关闭程序。并会在/data/anr目录下生成一个traces.txt文件,记录系统产生anr异常的堆栈和线程信息。如果是闪退,这问题比较难查, --------------------- 作者:xyang0917 来源:CSDN 原文:https://blog.csdn.net/xyang81/article/details/42319789 版权声明:本文为博主原创文章,转载请附上博文链接!

  • 2019-04-01 22:46:39

    电子签章的实施方案

    WORD/EXCEL签章模块,该部分实现与WORD/EXCEL的无缝结合,并提供给用户简单直观的菜单和工具条来实现文档签章验证等各种操作,其中,KHSC-64智能密码钥匙是签章模块中用户证书和图章的载体

  • 2019-04-01 22:48:25

    如何用 Java 对 PDF 文件进行电子签章

    印章是我国特有的历史文化产物,古代主要用作身份凭证和行驶职权的工具。它的起源是由于社会生活的实际需要。早在商周时代,印章就已经产生。如今的印章已成为一种独特的,融实用性和艺术性为一体的艺术瑰宝。传统的印章容易被坏人、小人私刻;从而新闻鲜有报道某某私刻公章,侵吞国家财产。随着计算机技术、加密技术及图像处理技术的发展,出现了电子签章。电子签章是电子签名的一种表现形式,利用图像处理技术、数字加密技术将电子签名操作转化为与纸质文件盖章操作相同的可视效果,同时利用电子签名技术保障电子信息的真实性和完整性以及签名人的不可否认性

  • 2019-04-01 22:59:22

    Android Studio 3.0 利用cmake搭建jni环境(很详细哦)

    我用的Android Studio是3.0的版本,然后想搭建一下jni的环境。这里把自己遇到的问题和注意点都记录下。 首先是需要在android studio里面安装最基本的环境。 打开Default Preference里面查看SDK Tool选项。

  • 2019-04-01 23:20:58

    隐藏在图片中的密钥

    在客户端开发的时候,有时需要把密钥保存在本地。这时就会遇到密钥安全性的问题。要保证密钥安全性,无非就是混淆、隐藏、白盒等手段。本文以隐藏在图片中来阐述密钥的安全保存。

  • 2019-04-01 23:22:33

    验证数字签名

    应预先设置验证首选项。在打开 PDF 后显示包含签名的验证详细信息时,这有助于确保数字签名有效。有关详细信息,请参阅设置签名验证首选项。

  • 2019-04-01 23:23:27

    图像隐写之使用PHP隐藏图像中的文本

    隐写术是一门研究隐藏信息的科学艺术,通过隐写术,可以只让发送者和接收者知道隐藏的信息。 图像隐写术则是研究将数据隐藏在图像中,通过该技术可以防止无关用户发现这些隐藏的信息或数据。