百度地图API:JavaScript开源库几何运算判断点是否在多边形内(电子围栏)

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

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

引入JS封装库

    <script type="text/javascript" src="//api.map.baidu.com/api?v=3.0&ak=3HGqGo***"></script><script type="text/javascript" src="//api.map.baidu.com/library/GeoUtils/1.2/src/GeoUtils_min.js"></script>

构建HTML地图容器

<div style="float:left;width:600px;height:500px;padding: 15px;" id="container"></div>

核心代码

var map = new BMap.Map("container");var pt = new BMap.Point(116.404, 39.915);map.centerAndZoom(pt, 16);map.enableScrollWheelZoom();//开启滚动缩放//电子围栏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);pts.push(pt1);pts.push(pt2);pts.push(pt3);pts.push(pt4);var opts = {fillColor: 'blue',fillOpacity: 0.3,strokeColor: 'blue',strokeStyle: "dashed",strokeWeight: 1,strokeOpacity: 0.5}var ply = new BMap.Polygon(pts, opts);map.addOverlay(ply);//地图监听事件map.addEventListener('click', function (e) {var x = e.point.lng;var y = e.point.lat;var newPoint = new BMap.Point(x, y);var mkr = new BMap.Marker(newPoint);map.addOverlay(mkr);//判断时间ptInPolygon(newPoint, ply);})var allOverlay = map.getOverlays();console.log(allOverlay[0]);//点在多边形内function ptInPolygon(pt, ply) {var result = BMapLib.GeoUtils.isPointInPolygon(pt, ply);if (result == true) {$("#control").append("操作在电子围栏内<br>");} else {$("#control").append("超出电子围栏<br>");}}

封装函数及优化


@漏刻有时

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/169558.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Python基础入门例程9-NP9 十六进制数字的大小

目录 描述 输入描述&#xff1a; 输出描述&#xff1a; 示例1 解答&#xff1a; 说明&#xff1a; 描述 计算的世界&#xff0c;除了二进制与十进制&#xff0c;使用最多的就是十六进制了&#xff0c;现在使用input读入一个十六进制的数字&#xff0c;输出它的十进制数字…

vue如何使用冻结对象提升代码效率及其原理解析

先给大家伙整个实际工作中一定会碰到的问题 如下vue dome ,它的代码非常简单功能也1非常简单,就是一个按钮,点击后会显示有多少条数据 来看看源码, html部分就是一个按钮绑定了一个loadData事件,然后在p标签内展示了这个myData这个数据的长度 <template><div id&quo…

java中的异常,以及出现异常后的处理【try,catch,finally】

一、异常概念 异常 &#xff1a;指的是程序在执行过程中&#xff0c;出现的非正常的情况&#xff0c;最终会导致JVM的非正常停止。 注意: 在Java等面向对象的编程语言中&#xff0c;异常本身是一个类&#xff0c;产生异常就是创建异常对象并抛出了一个异常对象。Java处理异常的…

编译原理-词法分析器

文章目录 对于词法分析器的要求概念词法分析器的功能和输出形式 词法分析器的设计词法分析器的结构单词符号的识别&#xff1a;超前搜索状态转换图 正规表达式和有限自动机正规式和正规集确定有限自动机&#xff08;DFA&#xff09;非确定有限自动机&#xff08;NFA&#xff09…

ThingsBoard的版本控制整合gitee

1、注册gitee账号,创建自己的空间,并且创建一个用于存储ThingsBoard相关的仓库 2、进入ThingsBoard的租户层,然后找到版本控制,进行配置 输入gitee的仓库地址 仓库URL:指定你的gitee的参考地址 仓库分支:master 身份验证:密码、访问令牌 用户名:登录账号 密码/访问令…

Leetcode 1089. 复写零

复写零 题目链接1089. 复写零 给你一个长度固定的整数数组 arr &#xff0c;请你将该数组中出现的每个零都复写一遍&#xff0c;并将其余的元素向右平移。 注意&#xff1a;请不要在超过该数组长度的位置写入元素。请对输入的数组 就地 进行上述修改&#xff0c;不要从函数返回…

【QT】其他常用控件2

新建项目 lineEdit 什么都不显示&#xff08;linux password&#xff09; password textEdit和plainTextEdit spinBox和doubleSpinBox timeEdit、dateEdit、dateTimeEdit label 显示图案&#xff0c;导入资源&#xff1a;【QT】资源文件导入_复制其他项目中的文件到qt项目中_St…

【proteus】8086 写一个汇编程序并调试

参考书籍&#xff1a;微机原理与接口技术——基于8086和Proteus仿真&#xff08;第3版&#xff09;p103-105&#xff0c;p119-122. 参考程序是p70&#xff0c;例4-1 在上一篇的基础上&#xff1a; 创建项目和汇编文件 写一个汇编程序并编译 双击8086的元件图&#xff1a; …

整理MongoDB文档:身份验证

整理MongoDB文档:身份验证 个人博客&#xff0c;求关注。 文章概叙 本文主要讲MongoDB在单机状态下的账户配置。理解了MongoDB的语法&#xff0c;对于如何配置用户权限会知道怎么配置&#xff0c;但是请注意给谁配置什么权限才是最重要的。 最小权限原则 系统的每个程序或者…

宝塔部署nginx遇到的400错误和502错误

在部署express项目的过程中&#xff0c;由于我的代码有些变化&#xff0c;于是在宝塔面板上我又重新上传了一下我的项目&#xff0c;结果阴差阳错的被nginx反向代理配置不当引起的400错误request header or cokkie is too large和自己代码逻辑问题引起的502 bad gataway给绊倒了…

Springcloud介绍

1.基本介绍 Spring Cloud是一系列框架的有序集合。它利用Spring Boot的开发便利性巧妙地简化了分布式系统基础设施的开发&#xff0c;如服务发现注册、配置中心、消息总线、负载均衡、断路器、数据监控等&#xff0c;都可以用Spring Boot的开发风格做到一键启动和部署。Spring …

springmvc视图格式——模板引擎freemarker输出HTML文本

目录 1. freemarker 介绍创建测试工程2.2.2) 配置文件2.2.3) 创建模型类2.2.4) 创建模板2.2.5) 创建controller2.2.6) 创建启动类2.2.7) 测试 2.3) freemarker基础2.3.1) 基础语法种类2.3.2) 集合指令&#xff08;List和Map&#xff09;2.3.3) if指令2.3.4) 运算符2.3.5) 空值处…

2023了,是时候使用pnpm了!

2023了&#xff0c;是时候使用pnpm了&#xff01; Excerpt 2023了&#xff0c;是时候使用pnpm了&#xff01; 什么是pnpm pnpm代表performant npm&#xff08;高性能的npm&#xff09;&#xff0c;同npm和Yarn&#xff0c;都属于Javascript包管理安装工具&#xff0c;它较npm和…

Arcgis 数据操作

在进行数据操作的时候&#xff0c;需要注意坐标系要一致&#xff0c;这是前提。 数据类型 文件地理数据库&#xff1a;gbd 个人地理数据库&#xff1a;mdb &#xff08;Mircosoft Access&#xff09; 矢量数据&#xff1a;shp 推荐使用gbd数据&#xff0c;效率会更高。 采…

“第六届世界声博会暨2023科大讯飞全球1024开发者节”开幕式回顾及舆情问题

☞ ░ 前往老猿Python博客 ░ https://blog.csdn.net/LaoYuanPython 2023年10月24日&#xff0c;笔者全程参加了在安徽合肥奥体中心举办的“第六届世界声博会暨2023科大讯飞全球1024开发者节”开幕式主论坛&#xff0c;下面来回顾一下。 一、会议简介 会议主题&#xff1a;“…

javaEE -8(9000字详解网络编程)

一&#xff1a;网络编程基础 1.1 网络资源 所谓的网络资源&#xff0c;其实就是在网络中可以获取的各种数据资源&#xff0c;而所有的网络资源&#xff0c;都是通过网络编程来进行数据传输的。 用户在浏览器中&#xff0c;打开在线视频网站&#xff0c;如优酷看视频&#xff…

Django学习笔记——文件上传(界面还怪好看得嘞)

定义文件上传函数 #文件上页面 def uploadFileIndex(request):return render(request, "uploadFile.html")#文件上传接口 def uploadFile(request):if request.method POST and request.FILES[file]:uploaded_file request.FILES[file]fs FileSystemStorage()# 选…

前端AJAX入门到实战,学习前端框架前必会的(ajax+node.js+webpack+git)(二)

阳光总在风雨后&#xff0c;请相信有彩虹。 案例 - 图书管理 bootstrap弹框 需求&#xff0c;点击添加按钮&#xff0c;没有离开当前页面&#xff0c;在当前页面弹出弹框&#xff08;弹窗&#xff09; 先学着实现一个简单的弹框&#xff0c;如下图右下角 bootstrap有两种方式…

螺旋矩阵[中等]

优质博文&#xff1a;IT-BLOG-CN 一、题目 给你一个m行n列的矩阵matrix&#xff0c;请按照顺时针螺旋顺序&#xff0c;返回矩阵中的所有元素。 示例 1&#xff1a; 输入&#xff1a;matrix [[1,2,3],[4,5,6],[7,8,9]] 输出&#xff1a;[1,2,3,6,9,8,7,4,5] 示例 2&#xf…

Java在非spring项目中读取 .properties后缀的自定义配置文件生成map,用于jar包开发读取内部或者外部配置文件

文章目录 代码演示效果参考文档 代码 package com.test.ljj;import java.io.File; import java.io.FileInputStream; import java.io.InputStream; import java.util.HashMap; import java.util.Map; import java.util.PropertyResourceBundle; import java.util.Set;public c…