2000字范文,分享全网优秀范文,学习好帮手!
2000字范文 > angular2项目中使用高德地图---热力图

angular2项目中使用高德地图---热力图

时间:2022-09-09 11:54:57

相关推荐

angular2项目中使用高德地图---热力图

第一次使用,记录下,下次好找

相关地址:

/package/ngx-amap

https://xieziyu.github.io/ngx-amap/api-doc/index.html

/dev/mapstyle/edit?styleid=a5852d8c318b404e540496283ab741c4

// 安装插件npm i ngx-amap --save// 组件所在的module中导入模块import { NgxAmapModule } from 'ngx-amap';imports: [....NgxAmapModule.forRoot({apiKey: '高德官网申请的开发者apikey'})],

简单地图的页面展示

<ngx-amap style="height: 600px;" [center]="[116.397428, 39.90923]" [zooms]="[10,20]"><amap-marker [position]="[116.397428, 39.90923]" ></amap-marker></ngx-amap>

热力图具体使用(官方东西太多,不好粘贴):

https://xieziyu.github.io/ngx-amap/#/plugins/amap-heatmap

部分解释:

1、center

center是定位到某个位置[center]='['经度', '维度'],

可以直接百度,但想要显示的跟自己预想的位置一样,可以去高德地图上去看更细节的经纬度

/dev/mapstyle/edit?styleid=a5852d8c318b404e540496283ab741c4

2、地图样式

<ngx-amap class="demo-map"style="width: 100%;height: 100%;"[center]="[122.146241, 30.11039]"[resizeEnable]="true"[zoom]="17"mapStyle="amap://styles/darkblue">

高德地图的自定义样式列表:

使用: amap://styles/+ 样式的名称

如: 使用标准颜色

amap://styles/normal

依次类推

标准

normal

幻影黑

dark

月光银

light

远山黛

whitesmoke

草色青

fresh

雅士灰

grey

涂鸦

graffiti

马卡龙

macaron

靛青蓝

blue

极夜蓝

darkblue

酱籽

wine

其他使用方法以后再加

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。