IEとEdgeだけgooglemap v3を表示することができない
自社で使用する管理画面を製作中です。
DBに登録されている住所を緯度、経度をに変換しhtml上にgoogle mapを表示する。
っといったものなのですが史上最悪のブラウザIEとWindows10から標準搭載
という名前で無理やりインストールされているEdgeの環境下で地図の表示が行えませんでした。
何が原因なんだろう…、他ブラウザでは問題なく表示されているんだけど。
使用コードは下記です。
<!DOCTYPE html> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Google Map</title> <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> <script> var geocoder = new google.maps.Geocoder(); var word = "住所日本語表記"; geocoder.geocode({'address': word,'region': 'jp'}, function(results, status){ if(status==google.maps.GeocoderStatus.OK){ if(results.length > 0){ var latlng = results[0].geometry.location; var lats = latlng.lat(); var lngs = latlng.lng(); } } google.maps.event.addDomListener(window, 'load', function() { var mapdiv = document.getElementById('gmap'); var myOptions = { zoom: 18, center: new google.maps.LatLng(lats, lngs), mapTypeId: google.maps.MapTypeId.ROADMAP, scaleControl: true, }; var map = new google.maps.Map(mapdiv, myOptions); var marker = new google.maps.Marker({ position: new google.maps.LatLng(lats, lngs), map: map, title: '住所日本語表記' }); }); } ); </script> </head> <body> <div id="gmap" style="width:800px;height:700px;"></div> </body> </html>
これでchromeだと問題なく表示できるのですが、Microsoft系のブラウザだとどうも…
何が原因なのか、引き続き探していこうと思います。