谷歌地圖v3灰色框與反應

嘿傢伙我想添加谷歌地圖到一個反應的項目，我得到一個灰色的盒子沒有錯誤。任何想法爲什麼。代碼如下：谷歌地圖v3灰色框與反應

componentDidMount: function(){ 


    function initMap() { 

     var map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 12, 
     center: {lat: 37.7749300, lng: -122.4194200}, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
     }); 
    }; 
     initMap(); 

}// end of cdm; 
});

來源

2016-01-14 trebek1

我注意到當我拉伸屏幕時，盒子呈現。我嘗試google.maps.event.addListenerOnce（地圖，'空閒'，函數（）{ google.maps.event.trigger（map，'resize'）; }）;但它沒有解決問題 – trebek1

同樣的問題相同的答案^^！ http://stackoverflow.com/questions/34779489/rendering-a-google-map-without-react-google-map/43624533#43624533 – thinhvo0108

您不應該使用document.getElementByID（'map'）。您試圖呈現google.maps容器的組件中是否存在此節點中的節點？

這應該真正的樣子

function renderMap() { 
    // map node 
    var mapNode = ReactDOM.findDOMNode(this.refs.map); 
    new google.maps.Map(mapNode, { 
     zoom: 12, 
     center: {lat: 37.7749300, lng: -122.4194200}, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }); 
}

您需要添加反應-DOM作爲一個依賴。

來源

2016-01-14 22:44:11 Daniel

這並沒有解決問題 – trebek1

谷歌地圖v3灰色框與反應

回答

相關問題