title: Google map is not draggable/dragging even after making it true
body: <p>Google map is not draggable/dragging even after making it true.</p>
  
  <p>steps to reproduce: load page with map in new tab, inspect and go to mobile view without doing anything. now in mobile view drag map left-right up-down, it will not works. </p>
  
  <p>Please Run Code Snippet.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>      var map;
        function initMap() {
          map = new google.maps.Map(document.getElementById('map'), {
            center: {lat: -34.397, lng: 150.644},
            zoom: 8,
            draggable: true
          });
        }</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>#map {
          height: 90%;
        }
        html, body {
          height: 90%;
          margin: 0;
          padding: 0;
        }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCk0vq10rCc-wxeYQb-E5IoB-E3WBtIMxA&amp;callback=initMap"
      async defer&gt;&lt;/script&gt;
  &lt;div id="map" data-role="page"&gt;&lt;/div&gt;https://stackoverflow.com/questions/ask#</code></pre>
  </div>
  </div>
  </p>