百度地图点标记加调用
先看效果
PHP代码
<?phpnamespace kds_addons\edata\controller;use think\addons\Controller;
use think\Db;class Maps extends Controller
{// 经纬度计算面积function calculate_area($points){$totalArea = 0;$numPoints = count($points);if ($numPoints > 2) {for ($i = 0; $i < $numPoints; $i++) {$j = ($i + 1) % $numPoints;$x1 = $points[$i]["lng"];$y1 = $points[$i]["lat"];$x2 = $points[$j]["lng"];$y2 = $points[$j]["lat"];$totalArea += deg2rad($x2 - $x1) * (2 + sin(deg2rad($y1)) + sin(deg2rad($y2)));}$totalArea *= 6378137 * 6378137 / 2;}return abs($totalArea);}// 地图设置public function set_pi(){$times = time();$id = intval(input("id"));$this->assign("id", $id);if (request()->isPost()) {$l2_json = trim(input("l2_json"));// dump($l2_json);$l2_json = htmlspecialchars_decode($l2_json);// $l2_json = stripslashes($l2_json);$l2_arr = json_decode($l2_json, true);// dump($l2_arr);Db::name("land_l2")->where("land_id", $id)->delete(); //删除数据$datas_ia = [];foreach ($l2_arr as $key => &$value) {// dump($value);$value["land_id"] = $id;$value["create_time"] = $times;ksort($value); //数组按键名排序$datas_ia[] = $value;}$datas_ia = array_values($datas_ia); //只保留数组中的valueDb::name("land_l2")->insertAll($datas_ia); //插入多条数据// 计算中心// 经度$lng_sum = Db::name("land_l2")->where("land_id", $id)->sum("lng");$lng_nu = Db::name("land_l2")->where("land_id", $id)->count("lng");$datas["lng"] = $lng_sum / $lng_nu;// 纬度$lat_sum = Db::name("land_l2")->where("land_id", $id)->sum("lat");$lat_nu = Db::name("land_l2")->where("land_id", $id)->count("lat");$datas["lat"] = $lat_sum / $lat_nu;// 计算面积$lists_l2 = Db::name("land_l2")->field(["lng", "lat"])->where("land_id", $id)->select();$area = $this->calculate_area($lists_l2);$datas["area_m2"] = $area;$datas["area_gq2"] = $area / 10000; //平方米转换为平方公顷$datas["not_gp2"] = $area / 10000; //平方米转换为平方公顷// 更新数据Db::name("land")->where("id", $id)->update($datas);$res = [];$res["code"] = 0;return json($res);}// 获取所有标记点$lists = Db::name("land_l2")->field(["lng", "lat"])->where("land_id", $id)->order("id asc")->select();$this->assign("lists", $lists);// 获取中心坐标$first = reset($lists);$this->assign("lng", $first["lng"]);$this->assign("lat", $first["lat"]);return $this->fetch();// return $this->fetch(request()->action() . "_qq");}// 地图查看public function se_pi(){$id = intval(input("id"));$this->assign("id", $id);// 获取所有标记点$lists = Db::name("land_l2")->field(["lng", "lat"])->where("land_id", $id)->order("id asc")->select();$this->assign("lists", $lists);// 获取中心坐标$first = reset($lists);$this->assign("lng", $first["lng"]);$this->assign("lat", $first["lat"]);return $this->fetch();// return $this->fetch(request()->action() . "_qq");}
}选点
<html><head><meta charset="utf-8"><title></title><meta name="renderer"content="webkit"><meta http-equiv="X-UA-Compatible"content="IE=edge,chrome=1"><meta name="viewport"content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0"><link rel="stylesheet"href="/yunqikds_static/iconfont/iconfont.css"><script src="/yunqikds_static/iconfont/iconfont.js"></script><link rel="stylesheet"href="/yunqikds_static/layuiadmin/layui/css/layui.css"media="all"><script src="/yunqikds_static/layuiadmin/layui/layui.js"></script><script src="/yunqikds_static/js/jquery-1.10.2.min.js"></script></head><body><div id="container"></div><ul class="drawing-panel"><li class="btn"onclick="map_tog()">切换</li><li class="btn"onclick="map_save()">保存</li></ul><script src="https://api.map.baidu.com/api?v=1.0&&type=webgl&ak=xxx"></script><script type="text/javascript"src="https://api.map.baidu.com/library/GeoUtils/1.2/src/GeoUtils_min.js"></script><script type="text/javascript">$(function () {layui.use(["layer",], function () {layer = layui.layer;});});var is_add = true; //解决单击添加和删除冲突的问题var map = new BMapGL.Map("container", {mapType: BMAP_SATELLITE_MAP, //卫星底图// mapType: BMAP_NORMAL_MAP, //矢量底图});`{if $lng&&$lat}`;var c_pi = new BMapGL.Point(parseFloat(`{$lng}`), parseFloat(`{$lat}`));`{else}`;var c_pi = "乐都区";`{/if}`;map.centerAndZoom(c_pi, 16);map.enableScrollWheelZoom(true);map.disableDoubleClickZoom(); //设置是否可以双击放大// 添加标记点function p_add(lat, lng, i = null) {lat = parseFloat(lat);lng = parseFloat(lng);var pis = new BMapGL.Point(lng, lat);var marker = new BMapGL.Marker(pis, {enableDragging: true,});if (i) {// console.log(i);var opts = {position: pis, // 指定文本标注所在的地理位置offset: new BMapGL.Size(0, 0) // 设置文本偏移量};var label = new BMapGL.Label(i, opts);// 自定义文本标注样式label.setStyle({color: "glay",borderRadius: "5px",borderColor: "red",padding: "5px",fontSize: "16px",height: "20px",lineHeight: "20px",fontFamily: "微软雅黑"});map.addOverlay(label);}marker.addEventListener("click", function (e) {// console.log(e);map.removeOverlay(marker); //删除标记map.removeOverlay(label); //删除标签is_add = false;setTimeout(function () {is_add = true;}, 1);});map.addOverlay(marker);}`{volist name="lists" id="vo"}`;p_add(`{$vo.lat}`, `{$vo.lng}`, `{$i}`);`{/volist}`;// 监听点击事件添加markermap.addEventListener("click", function (e) {// console.log(e);if (is_add) {p_add(e.latlng.lat, e.latlng.lng);}});// 切换地图类型function map_tog() {if (map.getMapType() != BMAP_SATELLITE_MAP) {map.setMapType(BMAP_SATELLITE_MAP); //卫星底图} else {map.setMapType(BMAP_NORMAL_MAP); //矢量底图}}// 保存标记标记点function map_save() {var l2_marker = [];// 获取经纬度var arr_marker = map.getOverlays();// console.log(arr_marker);$.each(arr_marker, function (key, vo) {// console.log(vo);l2_marker.push({lat: vo.latLng.lat,lng: vo.latLng.lng,});});// console.log(l2_marker);l2_marker = JSON.stringify(l2_marker);$.post("", {id: "{$id}",l2_json: l2_marker,}, function (params) {if (params.code == 0) {layer.msg("标记成功");} else {layer.msg("标记失败");}}, "json");}</script>
</body></html>效果查看
<html><head><meta charset="utf-8"><title></title><meta name="renderer"content="webkit"><meta http-equiv="X-UA-Compatible"content="IE=edge,chrome=1"><meta name="viewport"content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0"><link rel="stylesheet"href="/yunqikds_static/iconfont/iconfont.css"><script src="/yunqikds_static/iconfont/iconfont.js"></script><link rel="stylesheet"href="/yunqikds_static/layuiadmin/layui/css/layui.css"media="all"><script src="/yunqikds_static/layuiadmin/layui/layui.js"></script><script src="/yunqikds_static/js/jquery-1.10.2.min.js"></script></head><body><div id="container"></div><ul class="drawing-panel"><li class="btn"onclick="map_tog()">切换</li></ul><script src="https://api.map.baidu.com/api?v=1.0&&type=webgl&ak=xxx"></script><script type="text/javascript"src="https://api.map.baidu.com/library/GeoUtils/1.2/src/GeoUtils_min.js"></script><script type="text/javascript">$(function () {layui.use(["layer",], function () {layer = layui.layer;});});var map = new BMapGL.Map("container", {mapType: BMAP_SATELLITE_MAP, //卫星底图// mapType: BMAP_NORMAL_MAP, //矢量底图});`{if $lng&&$lat}`;var c_pi = new BMapGL.Point(parseFloat(`{$lng}`), parseFloat(`{$lat}`));`{else}`;var c_pi = "乐都区";`{/if}`;map.centerAndZoom(c_pi, 16);map.enableScrollWheelZoom(true);map.disableDoubleClickZoom(); //设置是否可以双击放大var polygon_path = [];`{volist name="lists" id="vo"}`;polygon_path.push(new BMapGL.Point(parseFloat(`{$vo.lng}`), parseFloat(`{$vo.lat}`)));`{/volist}`;// console.log(polygon_path);// 绘制面var polygon1 = new BMapGL.Polygon(polygon_path, {strokeColor: "#295BFF",strokeWeight: 3,strokeOpacity: 0.5,fillOpacity: 0,});map.addOverlay(polygon1);// 切换地图类型function map_tog() {if (map.getMapType() != BMAP_SATELLITE_MAP) {map.setMapType(BMAP_SATELLITE_MAP); //卫星底图} else {map.setMapType(BMAP_NORMAL_MAP); //矢量底图}}</script>
</body></html>相关文章：
百度地图点标记加调用
先看效果 PHP代码 <?phpnamespace kds_addons\edata\controller;use think\addons\Controller; use think\Db;class Maps extends Controller {// 经纬度计算面积function calculate_area($points){$totalArea 0;$numPoints count($points);if ($numPoints > 2) {f…...
MySQL 其他数据库日志
我们了解数据库事务时，知道两种日志：重做日志，回滚日志。 对于线上数据库应用系统，突然遭遇 数据库宕机 怎么办？在这种情况下，定位宕机的原因 就非常关键。我们可以查看数据库的 错误日志。因为日志中记录…...
为何企业和开发团队应该重视进行兼容性测试
随着科技的不断进步和软件的广泛应用，保证软件在不同平台和环境下正常运行变得至关重要。本文将探讨软件兼容性测试的重要性和好处，并介绍为何企业和开发团队应该重视进行兼容性测试，以确保软件的稳定性和用户体验。 提供用户友好的体验 软件…...
牛客网Verilog刷题——VL51
牛客网Verilog刷题——VL51 题目答案 题目 请编写一个十六进制计数器模块，计数器输出信号递增每次到达0，给出指示信号zero，当置位信号set 有效时，将当前输出置为输入的数值set_num。模块的接口信号图如下： 模块的时序图…...
从零实现深度学习框架——Transformer从菜鸟到高手(一)
引言 💡本文为🔗[从零实现深度学习框架]系列文章内部限免文章，更多限免文章见 🔗专栏目录。 本着“凡我不能创造的，我就不能理解”的思想，系列文章会基于纯Python和NumPy从零创建自己的类PyTorch深度学习框…...
数组指针
数组指针的定义 1.数组指针是指针还是数组？ 指针。 int a 10;int* p &a;//指向整型数据的指针 char b w;char* q &b;//指向字符变量的指针 所以数组指针应该是指向数组的指针。 2.数组指针应该怎么定义？ int arr[10] { 0 };int(*p)[10] …...
C++设计模式之过滤器设计模式
C过滤器设计模式 什么是过滤器设计模式 过滤器设计模式是一种行为型设计模式，它允许你在特定的条件下对输入或输出进行过滤，以便实现不同的功能。 该模式有什么优缺点 优点 可扩展性：过滤器设计模式允许您轻松地添加、删除或替换过滤器&a…...
SpringBoot整合RedisTemplate操作Redis数据库详解（提供Gitee源码）
前言：简单分享一下我在实际开发当中如何使用SpringBoot操作Redis数据库的技术分享，完整的代码我都提供了出来，大家按需复制使用即可！ 目录 一、导入pom依赖 二、yml配置文件 三、使用FastJson序列化 四、核心配置类 五、工具…...
SQL 执行计划管理（SPM）
一、SPM 需求背景 任何数据库应用程序的性能在很大程度上都依赖于查询执行，尽管优化器无需用户干预就可以评估最佳计划，但是 SQL 语句的执行计划仍可能由于以下多种原因发生意外更改：版本升级、重新收集优化器统计信息、改变优化器参数或模式…...
浅谈微服务异步解决方案
导言 异步是一种设计思想，不是设计目的，因此不要为了异步而异步，要有所为，有所不为。 异步不是『银弹』， 避免试图套用一个『异步框架』解决所有问题， 需要根据不同的业务特点或要求，选择合适的…...
【音视频SDK测评】线上K歌软件开发技术选型
摘要 在线K歌软件的开发有许多技术难点，需考虑到音频录制和处理、实时音频传输和同步、音频压缩和解压缩、设备兼容性问题等技术难点外，此外，开发者还应关注音乐版权问题，确保开发的应用合规合法。 前言 前面写了几期关于直播 …...
Jackson：String转object反序列化失败
场景 消费mq时String转Object 代码 for (MessageExt msg : msgs) {String msgBody new String(msg.getBody(), StandardCharsets.UTF_8);BinlogEvent binlogEvent JsonUtil.silentString2Object(msgBody, BinlogEvent.class);binlogEvent.setPort(Long.valueOf(port));tCo…...
Spark_Core---6
spark 相关概念补充 课程目标 了解spark的安装部署知道spark作业提交集群的过程 6.1 spark的安装部署 1、下载spark安装包 http://spark.apache.org/downloads.html 高版本不存在cdh的编译版本，可以从官网下载源码版本，指定高版本hadoop进行编译 编译…...
游戏运营需要什么条件和准备？
游戏运营是一个复杂的过程，需要综合考虑多个因素。以下是一些游戏运营需要的条件和准备： 1、良好的游戏产品 首先，需要有一款优秀、有吸引力的游戏产品。游戏的质量和内容决定了用户是否愿意下载、留存和付费。 2、游戏运营团队 拥有专业…...
SVN限制Message提交的格式
限制Message提交的格式必须为以下格式 [Version] [Description] [TPA] [Doors] REPOS"$1" TXN"$2"# Make sure that the log message contains some text. SVNLOOK/usr/bin/svnlook MSG$SVNLOOK log -t "$TXN" "$REPOS"if [[ $MSG ~ …...
windows下安装anaconda、pycharm、cuda、cudnn、PyTorch-GPU版本
目录 一、anaconda安装及虚拟环境创建 1.anaconda的下载 2.Anaconda的安装 3.创建虚拟环境 3.1 环境启动 3.2 切换镜像源 3.3环境创建 3.4 激活环境 3.5删除环境 二、pycharm安装 1.pycharm下载 2.pycharm的安装 三、CUDA的安装 1.GPU版本和CUDA版本、cudnn版本、显卡…...
【计算机网络】传输层协议 -- UDP协议
文章目录 1. 传输层相关知识1.1 端口号1.2 端口号范围划分1.3 知名端口号1.4 一些相关命令 2. UDP协议2.1 UDP协议格式2.2 UDP协议的特点2.3 什么是面向数据报2.4 UDP的缓冲区2.5 UDP使用注意事项2.6 基于UDP的应用层协议 1. 传输层相关知识 传输层是计算机网络中的一个重要层…...
python制作超高难度走迷宫游戏，你要来挑战嘛~（赶紧收藏）
前言 嗨喽~大家好呀，这里是魔王呐 ❤ ~! 走迷宫，是一项充满智慧的挑战~ 作为经常刷短视频的我们，见识过不少迷宫小游戏 当然印象深刻的当然是小动物走迷宫 这里有几组挑战走迷宫的小可爱。先来看看吧！ （1ÿ…...
springboot整合tio-websocket方案实现简易聊天
写在最前： 常用的http协议是无状态的，且不能主动响应到客户端。最初想实现状态动态跟踪只能用轮询或者其他效率低下的方式，所以引入了websocket协议，允许服务端主动向客户端推送数据。在WebSocket API中，浏览器和服务…...
《TCP IP网络编程》第十三章
第 13 章 多种 I/O 函数 13.1 send & recv 函数 Linux 中的 send & recv： send 函数定义： #include <sys/socket.h> ssize_t send(int sockfd, const void *buf, size_t nbytes, int flags); /* 成功时返回发送的字节数，失败…...
驱动开发 day8 (设备树驱动，按键中断实现led亮灭)
//编译驱动 (注意Makefile的编译到移植到开发板的内核) make archarm //清除编译生成文件 make clean ****************************************** //安装驱动 insmod mycdev.ko //卸载驱动 rmmod mycdev 需要在<内核路径>/arch/arm/boot/dts/ 修改 stm32mp157a-fsm…...
DataX将MySQL数据同步到HDFS中时，空值不处理可以吗
DataX将MySQL数据同步到HDFS中时，空值存到HDFS中时，默认是存储为\N，这样会有两个缺点： 会产生歧义，如果MySQL业务数据中有\N数据，那么存储到HDFS上是\N，null值存储也是\N，当用Hive查…...
P3373 【模板】线段树 2（乘法与加法）（内附封面）
【模板】线段树 2 题目描述 如题，已知一个数列，你需要进行下面三种操作： 将某区间每一个数乘上 x x x；将某区间每一个数加上 x x x；求出某区间每一个数的和。 输入格式 第一行包含三个整数 n , q , m n,q,m n,…...
实现langchain-ChatGLM API调用客户端（及未解决的问题）
langchain-ChatGLM是一个基于本地知识库的LLM对话库。其基于text2vec-large-Chinese为Embedding模型，ChatGLM-6B为对话大模型。原项目地址：https://github.com/chatchat-space/langchain-ChatGLM 对于如何本地部署ChatGLM模型，可以参考我之前…...
【AltWalker】模型驱动：轻松实现自动化测试用例的生成和组织执行
目录 模型驱动的自动化测试 优势 操作步骤 什么是AltWalker？ 安装AltWalker 检查是否安装了正确的版本 牛刀小试 创建一个测试项目 运行测试 运行效果 在线模型编辑器 VScode扩展 本地部署 包含登录、选择产品、支付、退出登录的模型编写 模型效果 1…...
大数据课程E3——Flume的Sink
文章作者邮箱：yugongshiye@sina.cn 地址：广东惠州 ▲ 本章节目的 ⚪ 掌握Sink的HDFS Sink； ⚪ 掌握Sink的Logger Sink； ⚪ 掌握Sink的File Roll Sink； ⚪ 掌握Sink的Null Sink； ⚪ 掌握Sink的AVRO Sink； ⚪ 掌握Sink的Custom Sink； 一、HDFS Sink …...
如何快速做单元测试？
首先写unit test之前，要确认自己的测试遵循两个原则： 1、尽量不要干涉原来的代码。从阅读代码的体验来说，不要让你的测试（哪怕是一小段if..else...的代码）出现在你准备测试的代码中。 2、代码要只是测试某个class里面…...
不同对象的集合转换
https://blog.csdn.net/qq_42483473/article/details/128984514 import com.alibaba.fastjson.JSON;import java.util.ArrayList; import java.util.List;/*** author */ public class ObjectConversion {/*** 从List<A> copy到List<B>* param list List<B>…...
【机器学习】Gradient Descent
Gradient Descent for Linear Regression 1、梯度下降2、梯度下降算法的实现(1) 计算梯度(2) 梯度下降(3) 梯度下降的cost与迭代次数(4) 预测 3、绘图4、学习率 首先导入所需的库： import math, copy import numpy as np import matplotlib.pyplot as plt plt.styl…...
直播读弹幕机器人：直播弹幕采集+文字转语音（附完整代码）
目录 前言代码实现请求数据解析数据文字转语音完整代码 高级点的tk界面版 前言 直播读弹幕机器人是指能够实时读取直播平台上观众发送的弹幕，并将其转化为语音进行播放的机器人。这种机器人通常会使用文字转语音技术，将接收到的弹幕文本转为语音&#x…...