###実現したいこと
IonicでGoogleMapを表示したいです。
まずは[Cafeタブ]にGoogleMapを表示させようと思っております。
###前提条件
サブヘッダーにタブを4つほど置いて画面を切り替わるようにしています
###エラー内容
画面になんにも表示されない
###該当のソースコード
html
1<ion-content class="padding has-subheader" ng-show="active_content=='store'"> 2 <div id="map"></div> 3</ion-content> 4
JS .controller('LocationTabCtrl', function($scope,$ionicLoading, $compile) { $scope.active_content = 'store'; $scope.setActiveContent = function(active_content) { $scope.active_content = active_content; }; function initialize() { var myLatlng = {lat : 35.681382, lng : 139.766084}; var map = new google.maps.Map(document.getElementById('map'), { center : myLatlng, zoom : 15 }); var infowindow = new google.maps.InfoWindow(); var service = new google.maps.places.PlacesService(map); service.nearbySearch({ location : myLatlng, radius : 1000, types : ['store'] }, callback); } function callback (results, status) { if(status === google.maps.places.PlacesServiceStatus.OK) { for (var i = 0; i <results.length; i++) { createMarker(results[i]); } } } function createMarker(place) { var placeLoc = place.geometry.location; var marker = new google.maps.Marker({ map : map, position : place.geometry.location }); google.maps.event.addListener(marker, 'click', function() { infowindow.setContent(place.name); infowindow.open(map, this); }) }; })
###試したこと
GooglemapAPIも取得しております
<script src="https://maps.googleapis.com/maps/api/js?v=3&key=[APIキー]&language=ja"></script>
###補足情報(言語/FW/ツール等のバージョンなど)
AngularJS, Ionic1を使用しております。
あなたの回答
tips
プレビュー