当前位置: 首页 > article >正文

uniapp 高德地图显示

1. uniapp 高德地图显示

  使用前需到**高德开放平台(https://lbs.amap.com/)**创建应用并申请Key
  登录 高德开放平台,进入“控制台”,如果没有注册账号请先根据页面提示注册账号
  打开 “应用管理” -> “我的应用”页面,点击“创建新应用”,根据页面提示填写内容创建应用
  在应用下点击“添加”为应用添加Key,根据需要分别为Android平台、iOS平台申请Key
  配置使用高德地图
  准备:https://lbs.amap.com/api/javascript-api-v2/prerequisites
  uni-app(map)https://uniapp.dcloud.net.cn/component/map.html

1.1. 登录控制台

  (1)登录 高德开放平台控制台,如果没有开发者账号,请 注册开发者
  (2)创建 key,进入应用管理,创建新应用,新应用中添加 key,服务平台选择 Web端(JS API)。
在这里插入图片描述
  (3)获取 key 和密钥。创建成功后,可获取 key 和安全密钥。
在这里插入图片描述
  (4)配置manifest.json
在这里插入图片描述

在这里插入图片描述

<template>
	<view>
		<!-- 地图 -->
		<map style="width: 100%; height: 300px;" :latitude="latitude" 
		:longitude="longitude" :markers="markers" :scale="scale">
		</map>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				longitude: 108.952,
				latitude: 34.223,
				scale:5,
				 markers: [{
				longitude: 108.952,
				latitude: 34.223,
					iconPath: '../../static/image/home-active.png',
					width:30,
					height:30
				}],
		}
	}
}
</script>
<style>
</style>

在这里插入图片描述


http://www.kler.cn/a/227341.html

相关文章:

  • RabbitMQ 部署指南
  • Java轻量级稀疏矩阵求解SparseLU4J
  • Matomo 访问图形显示异常
  • Linux内核与驱动面试经典“小”问题集锦(1)
  • Ubuntu server如何使用 Daphne + Nginx + supervisor部署 Django
  • MySQL运维实战(5.3) MySQL数据乱码的一些情况
  • 过来人的经验告诉你:程序员去外包与自研公司的区别
  • 计算机视觉中的目标跟踪
  • Linux驱动 SPI子系统
  • mysql-FIND_IN_SET查询优化
  • 从编程中理解:大脑的并行处理与多任务
  • P8598 [蓝桥杯 2013 省 AB] 错误票据--2024蓝桥杯冲刺省一
  • MATLAB矩阵的操作(第一部分)
  • thinkphp6入门(16)-- cache用法总结
  • Python3 交叉编译 numpy pandas scipy scikit-learn
  • 新零售供应链,尝试使用GaussDB链接场与货【华为云GaussDB:与数据库同行的日子】
  • 堪称灾难级攻击的 UDP FLOOD洪水攻击,应该如何防护?
  • Git使用命令大全
  • React16源码: React中处理hydrate的核心流程源码实现
  • React 面试题