2017-05-15 21 views
-1

私は高さと幅をパーセンテージで指定するアプリケーションでgoogleマップを実装しようとしています。クロムとファイアフォックスでは動作していますが、IEで同じことを試してみると、マップの領域はグレーです。 私はそれをどのように修正できるかを提案する人もいます。IE Google Mapが表示されない

<!DOCTYPE html> 
 
<html> 
 
<body> 
 

 
<h1>My First Google Map</h1> 
 

 
<div id="googleMap" style="width:100%;height:500%"></div> 
 

 
<script> 
 
function myMap() { 
 
var mapProp= { 
 
    center:new google.maps.LatLng(51.508742,-0.120850), 
 
    zoom:5, 
 
}; 
 
var map=new google.maps.Map(document.getElementById("googleMap"),mapProp); 
 
} 
 
</script> 
 

 
<script src="https://maps.googleapis.com/maps/api/js?key=api_key&callback=myMap"></script> 
 

 

 
</body> 
 
</html>

+0

あなたのAPIキーを表示することはおそらくいい考えではありません... –

+0

ありがとう@AlexWillison同じ次回をメモします –

+0

IE 10を使用していますか? –

答えて

1

それは、我々は問題がそうそしてちょうど設定している知って動作するかどうか、たとえば500pxなどのために、ピクセルの固定数に高さを設定してみてくださいhtmlbody高さを100%にして、地図のdivで500%の高さに戻ってください。

これはIEで発生します。これは、高さにパーセンテージを使用する場合、階層内の先行するすべての要素に高さが設定されている必要があるためです。

0

ズームの後にコンマを削除します。次のようなプロパティを記述することもできます。

var mapProp= { 
    center: { lat: 51.508742, lng: ,-0.120850} 
    zoom:5 
}; 

おそらくこれが役に立ちます。それ以外の場合は、高さを500%に設定し、それが機能するかどうか確認してください。私はIEでgmapsを使用し、それは完全に

歓声

作品
+0

それは解決しませんでした。私は両方のmapPropを変更しようとしたが、幅を変更しましたが、使用しません。 –

関連する問題