ionic4集成高德地图
一:key
首先去高德开发者平台注册一个账号,然后在申请一个key
需要注意的是获取安全码SHA1和PackageName
1:获取SHA1
打开cmd,目录定位在c盘/users/用户名文件/.android
然后输入输入命令
keytool -list -v -keystore debug.keystore
像这样:
你可能会报错:密钥库文件不存在: debug.keystore,
你可以打开系统User下的.android文件夹,看看有没有debug.keystore文件,如果没有这个文件可以看一下下面这个文章
https://blog.csdn.net/zhangxing52077/article/details/53997893
有了debug.keystore文件之后,重新输入命令
注意,他会提醒你输入秘钥库口令,口令是:android
2:PackageName
packageName这个是包名,在项目里config.xml文件里面获取
二:代码
1:在项目src目录下的index.html页面引入script
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.1&key=你的key"></script>
2:html
<ion-content><div #map_container class="map_container"></div>
</ion-content>
3:css
body,.map_container {
width: 100%;
height: 600px;
overflow:hidden;
margin:0;
z-index:1000
}
4:ts
import {AlertController} from '@ionic/angular';
declare var AMap;
@Component({selector: 'app-home',templateUrl: 'home.page.html',styleUrls: ['home.page.scss']
})
export class HomePage {@ViewChild('map_container') map_container: ElementRef;map: any;//地图对象constructor(public alertController: AlertController) {}ionViewDidEnter() {this.map = new AMap.Map(this.map_container.nativeElement, {view: new AMap.View2D({//创建地图二维视口zoom: 11, //设置地图缩放级别rotateEnable: true,showBuildingBlock: true})});}
}
就可以显示地图了。
参考文章https://blog.csdn.net/weixin_39461487/article/details/79798471
持续更新…
ionic4集成高德地图相关推荐
- ionic4集成高德地图踩坑(二)
使用TileLayer.Satellite添加卫星图到地图上. 贴代码 var satellite = new AMap.TileLayer.Satellite();this.map = new AM ...
- Vue中集成高德地图API实现定位与自定义样式信息窗体
场景 若依前后端分离版手把手教你本地搭建环境并运行项目: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/108465662 在上面 ...
- flutter集成高德地图获取位置
flutter集成高德地图获取位置 准备工作 在创建安卓应用 获取SHA1 获取当前位置 添加依赖 文件配置 build.gradle文件配置 AndroidManifest.xml配置 获取定位 准 ...
- 【QA】集成高德地图SDK闪退问题
集成高德地图SDK闪退问题 昨天集成高德地图SDK,地图显示正常,但是点击返回键退出地图的时候,程序闪退,排查发现销毁地图时调用,mapView.onDestroy() 闪退,不调用的话内存溢出,这. ...
- Anuglar8集成高德地图
Anuglar8集成高德地图 @我是一只小菜鸡传送门 Anuglar8集成高德地图github源码 一.自己新建一个angualr项目.emm-新建项目就不用教了吧. TODO- 二.开始搞事情吧 新 ...
- Android 集成高德地图
需要完成效果:集成高德地图,实现定位功能,并且实时刷新位置,每25秒自动刷新位置. 布局: <?xml version="1.0" encoding="utf-8& ...
- Android一步一步教你集成高德地图
转载请注明出处:http://blog.csdn.net/alpha58/article/details/56488734 前言 当项目中需要使用地图SDK的时候, 是选择高德地图还是百度地图呢?从对 ...
- Android中集成高德地图SDK实现地图定位和导航功能(二)
我们接着上一篇文章开始继续实现android中集成高德地图的SDK实现地图 定位,搜索,导航的功能 如何让地图在手机上实现呢? 1.配置AndroidManifest 中的权限申请 可以参考官方文档 ...
- Android中集成高德地图SDK实现地图定位和导航功能(一)
一.前期准备工作 1.在高德地图开发者平创建一个自己的项目 名称和应用类型随便填 2.添加Key 1.添加key 2.获取SHA1值 2.1.使用windwos+R 输入cmd 打开控制窗口 输入 w ...
最新文章
- 在Ubuntu 14.04和CentOS上安装boost1.55二进制包
- CHM综述-建立因果关系,合成菌群在植物菌群研究中的机会
- 一个模型通杀8大视觉任务,图像、视频生成大一统!MSRA+北大全华班「女娲」模型...
- python与c语言在语法上的区别-C语言和Python编程先学习哪个
- java用do while语句逆序输出_跟我学java编程—深入理解do-while循环语句的用法
- android 弹出网格菜单,在android中的recyclerView中显示弹出按钮的确...
- Windows Phone 知识锦(12月版)
- JS对象的属性名规则
- 一个JS多个数组取交集算法
- java程序设计比赛心得体会_对Java程序设计的感想.doc
- 安卓pdf阅读器_PDF阅读用哪款软件好?推荐这7款,简单又好用!
- ewebeditor 2.8.0目录遍历漏洞——漏洞复现
- 使用c语言实现后缀表达式计算器
- FireFox新标签页打开搜索和书签
- 电信专家王煜全:手机监管面临三大困境
- 华为云总裁称云计算市场第二场竞争刚开始 | 搜狗纽交所上市,市值近53亿美元
- HTML5自学笔记上
- 三星正在完成android更新,三星发布Android 10更新计划表!又三款机型被选中,有你的吗?...
- auther tonyxiao
- java.security.cert.CertPathValidatorException: Trust anchor for certification path not found.
热门文章
- 分析攻击IP来源地并画出饼图
- 如何为MySQL选择更合适的数据类型
- 物联网可编程高灵活度IoT网关或集线器是解决方案
- apache ab压力测试报错apr_socket_recv
- 不要直接对Request.Headers[If-Modified-Since]使用Convert.ToDateTime
- OCA读书笔记(1) - 浏览Oracle数据库架构
- FMS3系列(六):使用远程共享对象(SharedObject)实现多人时时在线聊天(Flex | Flash)
- 今日头条加密参数的识别
- 【20171123】【GITC精华演讲】贝业新兄弟李济宏:如何做到企业信息化建设的加减乘除...
- NoSQL分布式数据库的独家见解- Adam Fowler