私はIonicの新しいブランドです。私はほとんどのページに表示するGoogleマップを取得しようとしています。それはちょうどthe map displays blank like so.ですapiはdefinitely enabled on the google api consoleもありますので、それはできません。しかし、マップコントロールが存在するということはマップサービスに到達する必要があることを意味するので、私のアプリはリクエストを生成していないことは明らかです。Ionic2のネイティブGoogleマップを使用した空白のマップ - 正しいキー
誤ったAPIキーの結果として空白のマップが発生する可能性がありますが、私は3重チェックを行い、コードワインネイティブGoogleマッププラグインをインストールしたキーが正しいことを確認します。私は新しいキーを試して、プラグインを削除して再インストールして、両方の方法を組み合わせて、同じ問題がすべてのケースに残っています。
私の実装は、チュートリアル/イオンドキュメントから、ほぼそのまま持ち上げられ、そうそこに問題がある可能だろうと見ることができません。感謝すべてのヘルプ
import { Component, ViewChild, ElementRef } from '@angular/core';
import { NavController, NavParams, Platform } from 'ionic-angular';
import {
GoogleMap,
GoogleMapsEvent,
GoogleMapsLatLng,
CameraPosition,
GoogleMapsMarkerOptions,
GoogleMapsMarker
} from 'ionic-native';
@Component({
selector: 'page-profile',
templateUrl: 'profile.html'
})
export class ProfilePage {
@ViewChild('map') mapElement: ElementRef;
map: any;
infowindow: any;
constructor(public navCtrl: NavController, public navParams: NavParams, public platform: Platform) {
platform.ready().then(() => {
this.loadMap();
});
}
ngAfterViewInit() {
//this.loadMap();
}
ionViewDidLoad() {
console.log('ionViewDidLoad ProfilePage');
}
loadMap(){
let location = new GoogleMapsLatLng(-34.9290,138.6010);
this.map = new GoogleMap('map', {
'backgroundColor': 'white',
'controls': {
'compass': true,
'myLocationButton': true,
'indoorPicker': true,
'zoom': true
},
'gestures': {
'scroll': true,
'tilt': true,
'rotate': true,
'zoom': true
},
'camera': {
'latLng': location,
'tilt': 30,
'zoom': 15,
'bearing': 50
}
});
this.map.on(GoogleMapsEvent.MAP_READY).subscribe(() => {
console.log('Map is ready!');
});
}
}
。これは私をナットにしている。
アクセスしているドメイン固有のAPIキーですか? – Coder
ドメイン、プラットフォーム、その他の制限はありません。 –
通常、一部のAPIキーはドメインに固有であり、一部のAPIキーには任意のドメインを追加する機能があります。しかし、アクセスするドメインに関するGoogle APIの制限があります。 – Coder