mapbox gl map沒有焦點 - +符號不工作，直到我拖動地圖

Question

我無法找到如何讓我的Mapbox地圖上的+和 - 鍵放大/縮小。

單擊地圖似乎並未將重點放在地圖上。 如果我用鼠標拖動地圖，那麼+和 - 鍵將放大/縮小。

我找不到任何人抱怨這個問題。甚至一些Mapbox的例子也有這個問題。

Answer 1

當地圖在頁面上完成加載後，它似乎沒有「焦點」。我的地圖ID是'地圖'，所以我試過

$('#map').focus(); 

這不能解決問題。在瀏覽器調試器中使用'inspect元素'，我查看了地圖對象中的內容。 Mapbox使用畫布因此，使用畫布上的類選擇地圖

<div class="mapboxgl-canvas-container mapboxgl-interactive"> 
<canvas class="mapboxgl-canvas" tabindex="0" aria-label="Map" 
width="1196" height="817" style="position: absolute; 
width: 1088px; height: 743px;"></canvas>... 

，我用jQuery的地圖加載完成後，將焦點設置到畫布上。

map.on('load', function{ 
     $('.mapboxgl-canvas').focus(); 
}