uni-app app引入天地图

话不多说咸鱼来了

<template><view><div class="mapBox" style="width: 100%; height: 100vh;background: #ddc0c0;" id="mapId" ></div></view>
</template>
<script module="test" lang="renderjs">var mapexport default {created() {const charset = 'utf-8'const script = document.createElement('script')script.setAttribute('type','text/javascript')script.setAttribute('charset',charset)script.setAttribute('src','http://api.tianditu.gov.cn/api?v=4.0&tk=xxxxxxxxxxxxxxxxxxxxxxxxxx')document.getElementsByTagName('head')[0].appendChild(script)setTimeout(() => {this.initMap();}, 500)},methods: {//初始化地图initMap() {const a = new Promise((resolve, reject) => {if (window.T) {console.log('地图脚本初始化成功...');resolve(window.T);}});map = new window.T.Map('mapId');map.centerAndZoom(new window.T.LngLat( 102.682491, 25.051102), [12]);map.setMapType(window.TMAP_HYBRID_MAP); // 设置地图位地星混合图层},}}
</script>

重点:
1.module=“test” lang=“renderjs” 必须加上,否则报Error in created hook: "TypeError: Cannot read property ‘createElement’ of undefined,TypeError: Cannot read property ‘createElement’ of undefined错误。加上后手机浏览器也可以使用,目前没打包,不知道打包会不会出错。

2.你天地图申请的key
目前存在的问题:
1.一根手指头没法滑动地图,需要两根筷子
2.会出现:Uncaught TypeError: Cannot read property ‘x’ of undefined at http://api.tianditu.gov.cn/api?v=4.0&tk=xxxxxxxxxxx
3.等遇到在补充八哈

结果:在这里插入图片描述

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

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

相关文章

python统计分析——样本方差的分布

参考资料&#xff1a;用python动手学统计学 1、导入库 import numpy as np import pandas as pd import scipy as sp from scipy import statsfrom matplotlib import pyplot as plt import seaborn as sns 2、数据准备 建立一个平均数为4&#xff0c;标准差为0.8的正态分布…

http和https的区别是什么?https有什么优缺点?

HTTP&#xff08;Hypertext Transfer Protocol&#xff0c;超文本传输协议&#xff09;是一个简单的请求-响应协议&#xff0c;它通常运行在TCP之上。它指定了客户端可能发送给服务器什么样的消息以及得到什么样的响应。这个简单模型是早期Web成功的有功之臣&#xff0c;因为它…

【运行Python爬虫脚本示例】

主要内容&#xff1a;Python中的两个库的使用。 1、requests库&#xff1a;访问和获取网页内容&#xff0c; 2、beautifulsoup4库&#xff1a;解析网页内容。 一 python 爬取数据 1 使用requests库发送GET请求&#xff0c;并使用text属性获取网页内容。 然后可以对获取的网页…

Orion-14B-Chat-Plugin本地部署的解决方案

大家好,我是herosunly。985院校硕士毕业,现担任算法研究员一职,热衷于机器学习算法研究与应用。曾获得阿里云天池比赛第一名,CCF比赛第二名,科大讯飞比赛第三名。拥有多项发明专利。对机器学习和深度学习拥有自己独到的见解。曾经辅导过若干个非计算机专业的学生进入到算法…

数据结构-数组(详细讲解)

文章目录 数组数组的概述数组的图示一维数组二维数组 数组的定义一维数组的定义二维数组的定义 数组的取值赋值一维数组二维数组 数组的操作一维数组的操作索引实现指针实现 二位数组的操作矩阵转三元组矩阵的乘法 数组 数组的概述 概述&#xff1a;数组是一种线性数据结构&a…

游戏设计模式

单列模式 概念 单例模式是一种创建型设计模式&#xff0c;可以保证一个类只有一个实例&#xff0c;并提供一个访问该实例的全局节点。 优点 可以派生&#xff1a;在单例类的实例构造函数中可以设置以允许子类派生。受控访问&#xff1a;因为单例类封装他的唯一实例&#xf…

prism 10 for Mac v10.1.1.270激活版 医学绘图分析软件

GraphPad Prism 10 for Mac是一款专为科研工作者和数据分析师设计的绘图和数据可视化软件。以下是该软件的一些主要功能&#xff1a; 软件下载&#xff1a;prism 10 for Mac v10.1.1.270激活版 数据整理和导入&#xff1a;GraphPad Prism 10支持从多种数据源导入数据&#xff0…

Linux的bash命令语法

可用点 #!/bin/bash # 文件要以上面开始,.sh结尾的文件不需要# 赋权文件可执行权限 chmod x <fileName># 获取java jar包启动的进程id ps -ef | grep *.jar | grep -v grep | awk {print $2}shell变量 变量命令规则&#xff1a; 只能包含字母、数字、下划线&#xff1…

银行数据仓库体系实践(6)--调度系统

调度系统是数据仓库的重要组成部分&#xff0c;也是每个银行或公司一个基础软件或服务&#xff0c;需要在全行或全公司层面进行规划&#xff0c;在全行层面统一调度工具和规范&#xff0c;由于数据类系统调度作业较多&#xff0c;交易类系统批量优先级高&#xff0c;为不互相影…

uniapp对接微信APP支付返回requestPayment:fail [payment微信:-1]General errors错误-全网总结详解

一、问题描述 uniapp对接微信APP支付&#xff0c;本来是很简单的一件事&#xff0c;后端本来就是好的&#xff0c;只要填一些参数就行了&#xff0c;搞了我一晚上&#xff0c;主要卡在uniapp这边&#xff0c;拉起支付的时候&#xff0c;一直提示以下错误&#xff1a; {"er…

js数组/对象的深拷贝与浅拷贝

文章目录 一、js中的深拷贝和浅拷贝二、浅拷贝1、Object.assign()2、利用es6扩展运算符&#xff08;...&#xff09; 二、深拷贝1、JSON 序列化和反序列化2、js原生代码实现3、使用第三方库lodash等 四、总结 一、js中的深拷贝和浅拷贝 在JS中&#xff0c;深拷贝和浅拷贝是针对…

数学电路与电子工程1(MEE)—— 锁存器和触发器

1 逻辑综合 1.1 DCB/DEC转换器 下图是一个74HC42集成电路的逻辑图&#xff0c;它是一个二进制编码的十进制&#xff08;BCD to Decimal&#xff09;转换器&#xff0c;也称为DCB/DEC转换器。这种类型的IC通常用于将4位二进制数&#xff08;BCD&#xff09;转换为十进制输出。 …

PHP文件相关函数大总结

PHP中与文件相关的函数&#xff1a; 以下示例均以读取example.txt为例&#xff1a; example.txt的内容&#xff1a; this is a txt. 这是一个文件 1 .使用 file_get_contents 读取整个文件内容&#xff1a; $fileContent file_get_contents(example.txt); echo $fileContent…

Flink问题解决及性能调优-【Flink rocksDB读写state大对象导致背压问题调优】

RocksDB是Flink中用于持久化状态的默认后端&#xff0c;它提供了高性能和可靠的状态存储。然而&#xff0c;当处理大型状态并频繁读写时&#xff0c;可能会导致背压问题&#xff0c;因为RocksDB需要从磁盘读取和写入数据&#xff0c;而这可能成为瓶颈。 遇到的问题 Flink开发…

MySql8的简单使用(1.模糊查询 2.group by 分组 having过滤 3.JSON字段的实践)

MySql8的简单使用&#xff08;1.模糊查询 2.group by 分组 having过滤 3.JSON字段的实践&#xff09; 一.like模糊查询、group by 分组 having 过滤 建表语句 create table student(id int PRIMARY KEY,name char(10),age int,sex char(5)); alter table student add height…

【C/C++ 01】初级排序算法

排序算法通常是针对数组或链表进行排序&#xff0c;在C语言中&#xff0c;需要手写排序算法完成对数据的排序&#xff0c;排序规则通常为升序或降序&#xff08;本文默认为升序&#xff09;&#xff0c;在C中&#xff0c;<algorithm>头文件中已经封装了基于快排算法的 st…

记录我的历程

1、2024年1月30号更新 从2024年1月22号开始复更&#xff0c;已添加20篇文章&#xff0c; 前一阶段&#xff1a;排名1502450、原力分2、粉丝3人

PGsql 解析json及json数组

创建测试数据 drop table if exists json_test; create table json_test as select 111 as id, {"nodes":{"1692328028076":{"nodeId":"1692328028076","nodeName":"测试表1","nodeType":"DATACO…

STM32 OV7725摄像头模块识别颜色物体(1)--HSL二值化和腐蚀中心算法,并用串口输出数据

目录 前言 一、摄像头采集数据流程 二、如何将图像显示到电脑上 三、图像二值化 1、什么是RGB? 2、RGB565转RGB888 I、RGB565和RGB888的区别 II、代码 3、RGB转HSL I、什么是HSL II、转换公式 III、代码 3、输出一张摄像头二值化图片 I、原理 II、代码 四、简单的物体识别 1、…

ElasticSearch搜索引擎入门到精通

ES 是基于 Lucene 的全文检索引擎,它会对数据进行分词后保存索引,擅长管理大量的数据,相对于 MySQL 来说不擅长经常更新数据及关联查询。这篇文章就是为了进一步了解一下它,到底是如何做到这么高效的查询的。 在学习其他数据库的时候我们知道索引是一个数据库系统极其重要…