Q&A
コンソールにエラーとかは出ていないのですか？
GoogleMapを利用した、単純なページを作成しようとしていますが、地図が表示されず、真っ白なままとなって困り果てております。。
何かお気づきの点などございましたら、
よろしくお願いいたします。
###前提・実現したいこと
単純なGoogleMap APIを使用した地図の表示
###発生している問題・エラーメッセージ
APIキーなども設定しているが、マップが表示されない。
コンソールにエラーも表示されていない。
###該当のソースコード
HTML
1<!DOCTYPE html> 2<html> 3<head> 4<title> 5マップ情報 6</title> 7<meta charset="UTF-8" /> 8<meta name="viewport" content="width=device-width, initial-scale=1.0"> 9<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 10<style type="text/css"> 11#map_canvas { 12height: 300px; 13} 14</style> 15</head> 16 17 <body> 18 <div id="map_canvas"></div> 19 <script> 20 function initMap(){ 21 var centerPosition = new google.maps.LatLng(35.681298, 139.766247); 22 var option = { 23 zoom : 18, 24 center : centerPosition, 25 mapTypeId : google.maps.MapTypeId.ROADMAP 26 }; 27 //描画 28 var gmap = new google.maps.Map(document.getElementById('map_canvas'), option); 29 30 } 31 </script> 32 <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=XXXXXXX&callback=initMap"></script> 33 </body> 34</html> 35
回答1件
0
ベストアンサー
html
1<style type="text/css"> 2#map_canvas { 3height: 300px; 4} 5</script>
cssで map_canvas に高さを設定してください。
投稿2017/01/16 14:31
退会済みユーザー
総合スコア0
あなたの回答
tips
プレビュー
