帶有Google地圖的Ionic Sidemenu

Question

我正在尋找一個需要提供Ionic側菜單的解決方案，並且主頁應該具有當前位置的Google地圖。

有人可以讓我知道如何實現嗎？

更新

我在這里的 Codepen上找到了類似的東西，並試圖采用相同的東西來達到我的要求。 但是仍然面臨一些問題。

我的codepen鏈接是http://codepen.io/guruprasadvenkatarao/pen/zGdYNr

我認為問題出在代碼中

google.maps.event.addDomListener(window, 'load', function() {

.....

}

此功能從不執行。

有人可以指出我在做什么錯嗎？

Answer 1

我遇到了完全相同的問題，我認為您可能是像我這樣的新手/新手。 正如您已經知道的， addDomListener是從不觸發addDomListener ，所以如果您希望在觸發視圖時初始化地圖，而不是這樣做

google.maps.event.addDomListener(window, 'load', function() {
    // ....
}

做就是了

$scope.initMap = function() {
    // your code here
}

並將函數添加到地圖div中，如下所示：

<ion-view view-title="Map View">
    <ion-content>
        <div id="map" data-tap-disabled="true" ng-init="initMap()"></div>
    </ion-content>
</ion-view>

---

ps查看代碼后，您需要解決的第一個問題是google api密鑰。 如果看第24行，您會看到

<script src="http://maps.googleapis.com/maps/api/js?key=<Google API key>=true"></script>

並且您需要將其替換為有效密鑰。 查看獲取API密鑰 。

讓我知道您是否還有問題！