I want to add a position from google map in my project using this code
<div class="map">
<iframe src="https://myurl"></iframe>
</div>
but it didn't work. I receive the message error msg:google n'autorise pas la connexion
use google map guide https://developers.google.com/maps/documentation/javascript/adding-a-google-map instead of using <iframe> and it is considered a bad practice due to securtiy concerns
If you would like to use an iframe, you can use the Maps Embed API. On the link, you can put your address and it will generate an iframe snippet for your address. Please note that you need to have API key included as the value of your key parameter.
Here is a sample snippet that you can use:
<div id="map">
<iframe width="600" height="450" frameborder="0" style="border:0"
src="https://www.google.com/maps/embed/v1/place?q=place_id:ChIJB6jLlpY0_RIRMfzxHQUfogc&key=PUT_YOUR_API_KEY_HERE" allowfullscreen></iframe>
</div>
Hope this helps!
Related
I want to solve the problem in Google Map when I do z-index: -1 Do not activate the map but the div is above the map as I want ... I want to activate the map with the div remains above the map
<div id="map" style="z-index: -1;"></div>
<div id="filter-div-for-sale-mobile" style="transform-origin: left 78.5px;top: 39px;left: -273.61px;width:360.5px;" class="zsg-popover_arrow-up zsg-popover-adjustable popover-thick-top popover-no-close popover-visible filter-button-popover listing-type-popover">
I would recommend using the iframe option provided by Google as it is much more controllable in regards to the CSS styling perspective of making it responsive on a page.
Sample of what I mean. (the width and height for the iframe attribute aren't required)
<iframe width="600" height="450" frameborder="0" style="border:0"
src="https://www.google.com/maps/embed/v1/view?zoom=10¢er=51.5074%2C-0.1278&key=..." allowfullscreen></iframe>
It could be helpful to include the position of your element (fixed,relative or absolute ) etc.
Also what browser are you using?
I am trying to embed a PDF document using google docs viewer:
<iframe src="http://docs.google.com/gview?url=MY_FILE_URL&embedded=true" style="border: none;" height="900" width="100%"></iframe>
and Its working fine, but when I try to refresh the page multiple times.. sometimes IFrame content does show up and some other times It doesn't,and I get an empty head and body inside "IFrame " tag
tried to set expires to: 0
tried to add random numbers: MY_FILE_URL?var=rand() to solve some
cash issue
tried to add IFrame using jquery on after page has loaded
nothing seems to solve my problem..
you are not accessing the https version is the issue.
I had the same issue
change:
<iframe src="http://docs.google.com/gview?url=MY_FILE_URL&embedded=true" style="border: none;" height="900" width="100%"></iframe>
to
<iframe src="https://docs.google.com/gview?url=MY_FILE_URL&=embedded=true" style="border: none;" height="900" width="100%"></iframe>
hope that helps :)
Below is my google maps code which embeds a google map iframe into my website. However I need to know which part of the code gets rid of the description bubble as it is in the way and looks awful.
<iframe width="100%" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.co.uk/maps/embed/v1/vie?f=q&source=s_q&hl=en&geocode=Fef8HgMdTF8HACGtndVv4fvEAykHADl3VT_YRzGtndVv4fvEAw%3BFf-gHwMdtnoIACG4YnecgIb83ykH1S7ttDnYRzG4YnecgIb83w&q=mildenhall+to+raf+lakenheath&aq=&sll=52.387544,0.494041&sspn=0.099739,0.244446&ie=UTF8&ll=52.378862,0.524008&spn=0.035347,0.068778&t=m&saddr=mildenhall&daddr=raf+lakenheath&output=embed/v1/view"></iframe>
'&iwloc=near' no longer works with the new google api.
Thanks in advance
This answer :
Google Maps Embed - Remove Place Card
has a method of using a container div with overflow:hidden and a negative margin on the iframe to chop off the top containing the description bubble.
Just Add :
&iwloc=near in iframe src
Used like this:
<iframe width="400" scrolling="no" height="300" frameborder="0" src="https://maps.google.co.uk/maps?hl=en&q=so21+1aj&z=10&output=embed&iwloc=near" marginwidth="0" marginheight="0"></iframe>
Using jQuery I removed the bubble, from actual version of / place autocomplete version / google maps, modyfing one original function:
autocomplete.addListener('place_changed', function() {
// ... the function code, before it's closing
// tag I added 3 lines: //
$("div[class='gm-style-iw']").prev('div').remove(); // bubble
$("div[class='gm-style-iw']").next('div').remove(); // close button
$("div[class='gm-style-iw']").remove(); // text
});
it is also necessary to attach the jQuery library
I want to attach a google group to my website. Is there a way to do that? please help. I need HTML code to attach this group to my website.
You can use an iframe and some JavaScript
<iframe id="forum_embed"
src="javascript:void(0)"
scrolling="no"
frameborder="0"
width="900"
height="700">
</iframe>
<script type="text/javascript">
document.getElementById("forum_embed").src =
"https://groups.google.com/forum/embed/?place=forum/forum-name" +
"&showsearch=true&showpopout=true&parenturl=" +
encodeURIComponent(window.location.href);
</script>
where forum-name is the name of your Google group
Read more about it here
See this jsFiddle example for the group foresite
Is it possible without going to https://developers.facebook.com/tools/lint/ and putting in the URL, to rub a webservice or something and have it return the Iframe code? I do not want to go to that site manually. Thanks for any help
Just construct the URL yourself,
<iframe
src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fgoogle.com%2F"
scrolling="no" frameborder="0" style="height: 62px; width: 100%"
allowTransparency="true"></iframe>
and put your site's URL urlencoded behind the ?href=.
Here you go
just modify the urls array :)
http://jsfiddle.net/Tatqu/