uni-app设置地图显示

使用前需到**高德开放平台(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

登录控制台
登录 高德开放平台控制台,如果没有开发者账号,请 注册开发者。
在这里插入图片描述
创建 key
进入应用管理,创建新应用,新应用中添加 key,服务平台选择 Web端(JS API)。
在这里插入图片描述
获取 key 和密钥
创建成功后,可获取 key 和安全密钥。
在这里插入图片描述
配置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
				}],
		}
	}
}

在这里插入图片描述

相关推荐

  1. uni-app地图标点展示

    2024-01-02 06:46:03       60 阅读
  2. uni-app根据腾讯地图接口三级联动组件

    2024-01-02 06:46:03       50 阅读
  3. uni-app中的地图简单说明 map

    2024-01-02 06:46:03       29 阅读
  4. uni-app qiun-data-charts无法显示tooltip

    2024-01-02 06:46:03       47 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-01-02 06:46:03       98 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-01-02 06:46:03       106 阅读
  3. 在Django里面运行非项目文件

    2024-01-02 06:46:03       87 阅读
  4. Python语言-面向对象

    2024-01-02 06:46:03       96 阅读

热门阅读

  1. Spring04

    Spring04

    2024-01-02 06:46:03      44 阅读
  2. 我与VR的再拜之交

    2024-01-02 06:46:03       62 阅读
  3. 国科大2023.12.28图像处理0854最后一节划重点

    2024-01-02 06:46:03       50 阅读
  4. 2401编辑器,好插件

    2024-01-02 06:46:03       71 阅读
  5. TensorFlow Hub模型

    2024-01-02 06:46:03       57 阅读
  6. React16源码: ConcurrentMode的使用及源码实现

    2024-01-02 06:46:03       64 阅读
  7. .net8时代,微软.net开发策略,F#不就是VB语言吗?

    2024-01-02 06:46:03       53 阅读
  8. Linux 硬件配置

    2024-01-02 06:46:03       51 阅读
  9. AWS CDK安装到AWS EC2 Linux 2

    2024-01-02 06:46:03       53 阅读
  10. Python中常见的错误示

    2024-01-02 06:46:03       51 阅读