谷歌地圖v3多邊形/線垂直眼淚和偏移

在測試谷歌地圖地圖時，我遇到了一個奇怪的錯誤。渲染多邊形/線條時，我會沿着多邊形/線條週期性地看到垂直的「眼淚」。由眼淚和多邊形/線條本身創建的部分也具有基於縮放級別的隨機偏移。這發生在Linux上的Chrome瀏覽器，OSX上的Safari瀏覽器和Windows 10上的Edge上.GIF對此做了比我更好的解釋。谷歌地圖v3多邊形/線垂直眼淚和偏移

這裏是我的地圖選項：

zoom: 8, 
mapTypeId: google.maps.MapTypeId.HYBRID

這裏是我如何添加多邊形：

var polygon = new google.maps.Polygon({ 
    path: node.data.path, 
    title: node.text, 
    strokeColor: node.data.strokeColor, 
    strokeOpacity: node.data.strokeOpacity, 
    strokeWeight: node.data.strokeWeight, 
    fillColor: node.data.fillColor, 
    fillOpacity: node.data.fillOpacity 
}); 

mapElements[node.id].setMap(map);

我失去了一些東西，或者這是一個錯誤？

來源

2015-12-15 Josh I

在我而言，這是自舉3

問題基本上你要重寫爲box-sizing風格在你的畫布。

See this link for more details.

從link: [3.0 rc1] Google Maps Style Issues caused by * box-sizing #8945：

在引導3存在scaffolding.less基本樣式
* { 
    .box-sizing(border-box); 
} 
在一個谷歌地圖這導致信息窗口中繪製箭頭指向主盒子下面的標記。 http://grab.by/oYLU

你能更具體和公正的分配箱大小，以元素真正需要的，而不是一切得到它在頁面上呢？

我有一個似乎工作是把谷歌，地圖類在地圖DIV並設置其大小盒內容盒
.google-map-canvas { 
    .box-sizing(content-box); 
} 
//修正了GOOGLE地圖畫布
唯一的解決辦法
.google-map-canvas { 
    .box-sizing(content-box); 
    * { 
     .box-sizing(inherit); 
    } 
    // in case you ever set max-width to 100% this fixes that 
    img { 
     max-width: none; 
    } } 

來源

2015-12-15 16:56:23

谷歌地圖v3多邊形/線垂直眼淚和偏移

回答

相關問題