Googleマップのapi v3ストリートビューのカスタムクローズボタンを作成するにはどうすればよいですか？

Question

私はGoogleマップAPIのストリートビューモードでそのひどく小さな閉じるボタンをカスタマイズしようとしている：

私は通りが閉じるボタンを表示カスタマイズするにはどうすればよいですか？

Answer 1

リファレンス

私はストリートマップビューにDOMオブジェクトをプッシュする方法を説明するGoogleグループでthis referenceました。

カスタムJavaScriptコード

私はその後、いくつかのカスタムコーディングを行なったし、これは私が思い付いたものです：

window.addEventListener('DOMContentLoaded', function(e){ 

    // Get close button and insert it into streetView 
    // #button can be anyt dom element 
    var closeButton = document.querySelector('#button'), 
     controlPosition = google.maps.ControlPosition.RIGHT_TOP; 

    // Assumes map has been initiated 
    var streetView = map.getStreetView(); 

    // Hide useless and tiny default close button 
    streetView.setOptions({ enableCloseButton: false }); 

    // Add to street view 
    streetView.controls[ controlPosition ].push(closeButton); 

    // Listen for click event on custom button 
    // Can also be $(document).on('click') if using jQuery 
    google.maps.event.addDomListener(closeButton, 'click', function(){ 
     streetView.setVisible(false); 
    }); 

}); 

HTML

<button id="button" class="btn">&times;</button> 

CSS

jsbinに

デモ

相続人full demo（ヒント：地図上のストリートビューの男をドロップ）。