在Ionic2中使用原生Google地图的空白地图 - 正确密钥

我是Ionic的全新品牌，刚刚开始使用它，我的第一个项目。我正试图让谷歌地图显示在网页上，现在我几乎已经有了。这只是the map displays blank like so. api也是definitely enabled on the google api console，所以它不可能是这样。然而，很明显，我的应用程序没有生成任何请求，这很奇怪，因为地图控件存在这一事实意味着我必须到达地图服务，好吗？在Ionic2中使用原生Google地图的空白地图 - 正确密钥

我知道空白地图可能会发生，作为一个不正确的api键的结果，但我有三重检查，我安装了科尔多瓦本地谷歌地图插件与关键是正确的。我尝试了新的密钥，删除并重新安装插件，并将两种方法结合在一起，同样的问题在所有情况下都持续存在。

我实现抬离教程/离子文档几乎一字不差，所以不能看到有会是一个问题有：

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!'); 
     }); 

    } 

}

任何帮助表示赞赏;这让我疯狂。

来源

2017-02-13 Richard Gibson

您的API密钥是特定于您正在访问的域的？ – Coder

没有，根本没有域名，平台或任何其他限制。 –

通常一些API密钥是特定于域的，一些API密钥可以添加任何所需的域。但Google API对访问域会有限制。 – Coder

事实证明，即使我通过SDK管理器，我有谷歌播放安装服务保证，以及因为使用模拟器的x86映像是Google Api v3的需求（或者我读过），所以仿真器不能与Play服务一起使用。

这是v3 Google API所必需的。在真正的android 7设备上运行完美。

来源

2017-02-14 13:10:45

谷歌地图的API键具有URL限制。

为了防止第三方使用自己的网站客户端ID，使用客户端ID的限制为网址您特别授权的列表。

要查看您已授权的URL或授权其他网址：

1.登录到谷歌云支持门户。

2.在左侧菜单中，单击地图：管理客户端ID。检查基础上，请求的来源

网址，并且可以开发的URL如http://localhost:8080

来源

2017-02-14 00:00:17 n00b

感谢您的建议，但我从来没有见过或设置在云支持的帐户门户网站，并没有对我产生的任何凭据，所以不知道我怎么会访问 –

在Ionic2中使用原生Google地图的空白地图 - 正确密钥

回答

相关问题