Android NativeScript谷歌地图Api-谷歌地图看起来太小

我正在用NativeScript v6和Angular 8编写一个应用程序

tns——版本 6.1.2

我正在使用它来尝试显示谷歌地图

地图出现，没有抛出错误，但地图太小，我看不到标记

以下是我的代码片段：

组成部分：

import { Component, OnInit } from '@angular/core';
//import { registerElement } from 'nativescript-angular/element-registry';
import { MapView, Marker, Position } from "nativescript-google-maps-sdk";

import { ElementRef, ViewChild } from "@angular/core";
import { registerElement } from "nativescript-angular/element-registry";

// Important - must register MapView plugin in order to use in Angular templates
registerElement('MapView', () => MapView);
@component({
selector: "ns-clocking",
templateUrl: "./clocking.component.html",
styleUrls: ["./clocking.component.css"],
moduleId: module.id
})
export class ClockingComponent implements OnInit {

mapView: MapView;

constructor() {}

public ngOnInit() {}

public onMapReady(event) {
    console.log(" map ready ");

    const mapView = event.object;

    this.mapView = mapView;

    const NA_CENTER_LATITUDE = 39.8283459;
    const NA_CENTER_LONGITUDE = -98.5816737;

    this.mapView.latitude = NA_CENTER_LATITUDE;
    this.mapView.longitude = NA_CENTER_LONGITUDE;
    this.mapView.zoom = 3;

    const stLouisCoordinates = {
        latitude: 38.619081,
        longitude: -90.196846
    };

    const stLouisMarker = new Marker();
    stLouisMarker.position = Position.positionFromLatLng(
        stLouisCoordinates.latitude,
        stLouisCoordinates.longitude
    );
    stLouisMarker.title = "St. Louis, MO";
    stLouisMarker.snippet = "Go Cardinals!";
    stLouisMarker.color = "#6B8E23";
    this.mapView.addMarker(stLouisMarker);

}
}

模板：

<ScrollView>
    <Page class="page">
        <StackLayout>

            <Label class="h3" text="Maps"></Label>

            <GridLayout>
                <MapView
                    #mapView
                    i-padding="50,50,50,50"
                    (mapReady)="onMapReady($event)"
                    iosOverflowSafeArea="true">
                </MapView>
            </GridLayout>

        </StackLayout>
    </Page>
</ScrollView>

---

我怀疑这是因为StackLayout中包装了MapView。您必须使用单个网格布局，并将标签下方的所有空间分配给MapView

<Page class="page">
    <GridLayout rows="auto,*">
        <Label row="0" class="h3" text="Maps"></Label>
        <MapView row="1"
            #mapView
            i-padding="50,50,50,50"
            (mapReady)="onMapReady($event)"
            iosOverflowSafeArea="true">
        </MapView>
    </GridLayout>
</Page>

在这两者之间，您应该仅在必要时使用ScrollView，主要是在页面内而不是页面上方。页面设计为放置在框架内，完全用于导航目的

---

在

了解更多关于布局的信息地图更大，但它是空白的，只是灰色的。这与OP无关，我猜您一定是缺少密钥，或者使用了错误的证书来构建应用程序，而不是在开发控制台中配置的。我有一个从谷歌控制台生成的密钥。然后我建议您查看Android设备监视器的错误日志，您可能会清楚地了解出了什么问题。记住，地图在模拟器上不起作用，它需要一个设备。我正在一个真实的设备上测试。我为这个问题提出了一个新问题。