Google Maps Embed - Remove Place Card

后端 未结 3 982
死守一世寂寞
死守一世寂寞 2020-12-14 16:36

I\'m using the new Google maps embed code (iFrame) to add a small map to my website, but I can\'t hide the new address box in the top left corner (see image below).

相关标签:
3条回答
  • 2020-12-14 17:18

    you can try this:

    1. Go to https://www.maps.ie/coordinates.html to get your Coordinates
    2. Go to Google Maps and enter those coordinates (comma separated like this: 33.319663, -111.89780100000002)
    3. Click on Share (located on the left)
    4. Click on Embed Map
    5. Configure the size of map that you want
    6. Copy the html

    Your iframe will be something like this:

    0 讨论(0)
  • 2020-12-14 17:21

    You can remove placecard & map controls (map type & zoom icons)

    <div style="width: 100%; overflow: hidden; height: 350px;">
        <iframe width="100%" height="600" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"  style="border:0; margin-top: -150px;"  src="https://maps.google.com/maps?f=l&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=Walt+Disney+World+Resort&amp;aq=t&amp;sll=28.38545007745952, -81.56377744291994&amp;ie=UTF8&amp;ll=28.38545007745952, -81.56377744291994&amp;z=17&amp;om=0&amp;iwloc=addr&amp;iwd=0&amp;layer=0&amp;output=embed"></iframe></small>
        </div>
    

    Note: you can add/remove parameters if you want

    https://moz.com/ugc/everything-you-never-wanted-to-know-about-google-maps-parameters

    0 讨论(0)
  • 2020-12-14 17:30

    You can hide all buttons with css. Create a container div width overflow on hidden and the sizes you need. Place the new google maps iframe/embed inside with a largersize. To position the maps iframe use negative marges..

    Example with 100% width:

    <div style="width: 100%; overflow: hidden; height: 300px;">
      <iframe 
         src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d39797.07748547086!2d5.46683904751879!3d51.433965676849986!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c6d90575ca5e3d%3A0x55989f5f344b006!2sPrins+Hendrikstraat+5!5e0!3m2!1snl!2snl!4v1392716144537"
         width="100%"
         height="600"
         frameborder="0"
         style="border:0; margin-top: -150px;">
      </iframe>
    </div>
    

    Make the iframe 300px higher than your container div. 150px to hide below and 150px to hide on top. To hide this 150 on the top of the iframe use:

    margin-top: -150px;

    0 讨论(0)
提交回复
热议问题