1.問題描述：

提供兩套標(biāo)準(zhǔn)方案，可根據(jù)體驗(yàn)需求選擇：

1.地圖Picker(地點(diǎn)詳情)

用戶體驗(yàn)：①展示地圖 ②標(biāo)記地點(diǎn) ③用戶選擇已安裝地圖應(yīng)用

接入文檔：https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/map-location-details-V5

2.導(dǎo)航意圖面板

用戶體驗(yàn)：①用戶選擇已安裝地圖應(yīng)用

接入文檔：https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/start-intent-panel-V5

解決方案：

檢查一下是否存在圖片風(fēng)控：https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/push-image-control-V5

2.問題描述：

地圖組件里marker的位置如何能固定在屏幕指定位置，比如我想讓marker固定顯示在 屏幕寬度/2,屏幕高度/4的位置上，該如何設(shè)置

解決方案：

這邊可以嘗試下使用stack布局，在地圖組件上疊一個(gè)marker樣式。

嘗試下如下demo：

import { map, mapCommon, MapComponent } from '@kit.MapKit';import { AsyncCallback } from '@kit.BasicServicesKit';// 1、導(dǎo)入文件import display from '@ohos.display'@Entry@Componentstruct Index3 {private mapOptions?: mapCommon.MapOptions;private callback?: AsyncCallback<map.mapcomponentcontroller>;private mapController?: map.MapComponentController;@State screenWidth: number = 0@State screenHeight: number = 0aboutToAppear(): void {// 初始化圖標(biāo)// 地圖初始化參數(shù)，設(shè)置地圖中心點(diǎn)坐標(biāo)及層級let target: mapCommon.LatLng = {latitude: 39.9181,longitude: 116.3970193};let cameraPosition: mapCommon.CameraPosition = {target: target,zoom: 15};this.mapOptions = {position: cameraPosition};// 地圖初始化的回調(diào)this.callback = async (err, mapController) =&gt; {if (!err) {this.mapController = mapController;}}display.getAllDisplays((err, data) =&gt; {let screenWidth: number = data[0].widthlet screenHeight: number = data[0].heightconsole.log('width = ' + screenWidth + 'height = ' + screenHeight)console.log('width + height = ' + JSON.stringify(data))})}build() {Stack() {MapComponent({ mapOptions: this.mapOptions, mapCallback: this.callback }).width('100%').height('100%')marker().position({ x: "44%", y: "25%" })}}}@Componentstruct marker {build() {Column({ space: 5 }) {Image($r('app.media.xxx')).width(50)Text("xxxx")}.width(50).height(50)}}

3.問題描述：

使用華為地圖進(jìn)行地圖開發(fā)，定位圖標(biāo)展示不滿足需求；

期望是連續(xù)定位、地圖中心點(diǎn)不跟隨定位藍(lán)點(diǎn)移動(dòng)、定位藍(lán)點(diǎn)的方向依據(jù)設(shè)備方向旋轉(zhuǎn)；

目前最合適的是用defaule模式，但是default模式定位藍(lán)點(diǎn)的方向無法旋轉(zhuǎn)，期望能夠支持跟隨設(shè)備旋轉(zhuǎn)。

解決方案：

經(jīng)過確認(rèn)，目前的規(guī)格就是，在連續(xù)定位時(shí)，進(jìn)行隨設(shè)備旋轉(zhuǎn)和跟隨移動(dòng)。

設(shè)計(jì)時(shí)分析了常見的競品，也都沒有提供目前需求的這種方式。

如果不是連續(xù)定位的話，可以不跟隨移動(dòng)；

后續(xù)應(yīng)該不會(huì)增加類似的功能，麻煩伙伴自行選擇要用哪種模式。

4.問題描述：

如何打開三方地圖應(yīng)用候選列表？

解決方案：

可以使用Ability Kit提供的拉起導(dǎo)航類應(yīng)用 能力：

https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/start-navigation-apps-V5

5.問題描述：

使用MapComponent組件，在mapCallback回調(diào)中添加marker，大頭針太大，無法設(shè)置大小。

解決方案：

import { map, mapCommon, MapComponent } from '@kit.MapKit';import { AsyncCallback } from '@kit.BasicServicesKit';import { image } from '@kit.ImageKit';@Entry@Componentstruct AddMarker {private mapOptions?: mapCommon.MapOptions;private mapController?: map.MapComponentController;private callback?: AsyncCallback<map.mapcomponentcontroller>;@State imagePixelMap: PixelMap | undefined = undefined;getMarkerPixelMap() {getContext(this).resourceManager.getMediaContent($r("app.media.startIcon")).then((data) =&gt; {let arrayBuffer = data.buffer.slice(data.byteOffset, data.byteLength + data.byteOffset)let imageSource: image.ImageSource = image.createImageSource(arrayBuffer);imageSource.getImageInfo((err, value) =&gt; {//獲取圖片資源的尺寸console.log('testTag',`圖片的尺寸為：width:${value.size.width}height:${value.size.height}`)if (err) {return;}//轉(zhuǎn)PixelMap，也可以在這個(gè)里面設(shè)置寬和高，比如下面是在原有的寬高基礎(chǔ)上放大5倍let opts: image.DecodingOptions ={ editable: true, desiredSize: { height: value.size.height*5, width: value.size.width*5 } };imageSource.createPixelMap(opts, (err,pixelMap) =&gt; {console.log('testTag', `createPixelMap`)this.imagePixelMap = pixelMapthis.addMarker()})})})}addMarker() {// Marker初始化參數(shù)let markerOptions: mapCommon.MarkerOptions = {position: {latitude: 31.984410259206815,longitude: 118.76625379397866},rotation: 0,visible: true,zIndex: 0,alpha: 1,anchorU: 0.5,anchorV: 1,clickable: true,draggable: true,flat: false,icon:this.imagePixelMap};console.log('testTag', `addMarker`)this.mapController?.addMarker(markerOptions);}aboutToAppear(): void {// 地圖初始化參數(shù)this.mapOptions = {position: {target: {latitude: 31.984410259206815,longitude: 118.76625379397866},zoom: 15}};this.callback = async (err, mapController) =&gt; {if (!err) {console.log('testTag', `callback`)this.mapController = mapController;this.getMarkerPixelMap()}};}build() {Stack() {Column() {MapComponent({ mapOptions: this.mapOptions, mapCallback: this.callback });}.width('100%')}.height('100%')}}

6.問題描述：

javaScript引入華為地圖API文件，其中key要經(jīng)過URL轉(zhuǎn)碼。是如何轉(zhuǎn)碼的？

解決方案：

文檔上說明使用API密鑰時(shí)需要調(diào)用URLEncoder.encode(“Your apiKey”, “UTF-8”)方法對API密鑰進(jìn)行encodeURI編碼。請參考文檔：https://developer.huawei.com/consumer/cn/doc/HMSCore-Guides/javascript-api-preparations-0000001078448006#section175508543353

如何保護(hù)API密鑰？：https://developer.huawei.com/consumer/cn/doc/HMSCore-Guides/faq-0000001050166999#section78166185011</map.mapcomponentcontroller></map.mapcomponentcontroller>