ぼやけた/壊れたGoogleマップのコントロール

Question

私はGoogleマップアプリで本当に奇妙な動きを見ています。私のようなAPIをロードしています

initialize: -> 
    osmMapType = new google.maps.ImageMapType(
     getTileUrl: (coord, zoom) -> 
     "http://tile.openstreetmap.org/#{zoom}/#{coord.x}/#{coord.y}.png" 
     tileSize: new google.maps.Size(256, 256) 
     isPng: true 
     alt: "OpenStreetMap layer" 
     name: "OSM" 
     maxZoom: 19 
    ) 

    cloudMadeMapType = new google.maps.ImageMapType(
     getTileUrl: (coord, zoom) -> 
     "http://b.tile.cloudmade.com/a97cc0871d97477b911c3f9155a93ee7/26250/256/#{zoom}/#{coord.x}/#{coord.y}.png" 
     tileSize: new google.maps.Size(256, 256) 
     isPng: true 
     alt: "CloudMade layer" 
     name: "CMade" 
     maxZoom: 13 
    ) 

    lat = 51.503 
    lng = -0.113 
    latlng = new google.maps.LatLng(lat, lng) 
    options = 
     zoom: 10 
     center: latlng 
     mapTypeId: 'OSM' 
    @gMap = new google.maps.Map(document.getElementById("map"), options) 
    @gMap.mapTypes.set('OSM', osmMapType) 
    @gMap.mapTypes.set('CloudMade', cloudMadeMapType) 
    @gMap.setMapTypeId(google.maps.MapTypeId.TERRAIN) 

：

<script src="https://maps.googleapis.com/maps/api/js?sensor=false" type="text/javascript"></script> 

しかし、いくつかの理由のために... Googleはコントロールとオーバーレイが "ぼやけ" されるマップ：

blurry controls... http://vuknikolic.wordpress.com/2012/04/02/twitter-bootstrap-and-google-maps-v3/私はバックボーンを使用しています

と情報ウィンドウ...

コードを繰り返し見ているため、エラーが表示されず、コンソールにもエラーはありません。

---

@geocodezipは正しかった、それはCSSだった。基本的にGoogle Mapsは、BootStrapがイメ​​ージの最大幅をハンドリングする方法を好まない。つまり、あなたのコード内のエラーがない

#map img { 
    max-width: none; 
} 

http://vuknikolic.wordpress.com/2012/04/02/twitter-bootstrap-and-google-maps-v3/

Answer 1

...あなたのCSSに少しハックを配置する必要があります。それはあなたのCSSの問題です。

ちょうどあなたのマップ・コンテナ（それはid=gmapを持っていると仮定して）で、このCSSを追加します。

#gmap img { 
    max-width: none; 
}