Chrome 和 FF 显示“margin-top”的方式不同

Question

我的谷歌地图在 Firefox 和 IE 中运行良好。但是当通过 chrome 加载时，地图将在顶部。而且似乎所有代码功能都可以正常工作 我找到了 边距顶部：-400px； /地图位置/ 左边距：-400px； /地图位置/ 在 Firefox 中找到工作，但在 chrome 中工作太重要了 我的部分代码如下：

<style>
BODY {
 font-family : Verdana,Arial,Helvetica,sans-serif; 
 color: #000000; 
 font-size : 13px ; 
 background-color:#8ba4d9; 
 }
 #map_canvas {
width: 300px;
height: 300px;

box-shadow: 1px 5px 5px #666;

position:absolute;
left:50%;
top:50%;

margin-top:-400px;   /*map position*/
margin-left:-400px;  /*map position*/
}
</style>
 <script type='text/javascript'>
 var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
</script>
 <div id="map_canvas" align="center" style="width:65%; height:90% ; position: relative;"></div>

Answer 1

试试这个脚本

google.load('visualization', '1', {'packages': ['geomap']}); google.setOnLoadCallback(drawMap);

function drawMap() {
  var data = google.visualization.arrayToDataTable([
    ['Country', 'Popularity'],
    ['Germany', 200],
    ['United States', 300],
    ['Brazil', 400],
    ['Canada', 500],
    ['France', 600],
    ['RU', 700]
  ]);

  var options = {};
  options['dataMode'] = 'regions';

  var container = document.getElementById('map_canvas');
  var geomap = new google.visualization.GeoMap(container);
  geomap.draw(data, options);

};

与

您是否已将 https://www.google.com/jsapi'> 添加到您的页面（此脚本很重要）