I am listing lots of businesses and their static google maps in my page (with a pagination). While going through the pages, sometimes Im getting the following image instead of maps. And if I refresh the page again, I will get the correct maps.
I am sure that I have not reached the usage limit (because Im getting the same maps on page refresh).
My sample request is given below . (Note: I am not passing any API key. Is it really required ? )
<img src="//maps.googleapis.com/maps/api/staticmap?center=168 Palmers Lane Pokolbin,POKOLBIN,NSW,2320,Australia&zoom=11&size=240x180&maptype=roadmap&sensor=false" />
Pass encodeURI-ed urls to src:
<img src="//maps.googleapis.com/maps/api/staticmap?center=168%20Palmers%20Lane%20Pokolbin,POKOLBIN,NSW,2320,Australia&zoom=11&size=240x180&maptype=roadmap&sensor=false" />
Related
I'm trying to build a custom image search using Google's CSE and I'm facing some difficulties getting the URL from the result box.
I have already created a new search engine and implemented the code on my web page.
The results are showing properly and the search engine is working as intended.
Now what I would like to get is:
Avoid opening the picture on another window
Click on the image and get the real URL of the picture (not encrypted)
Display selected url on alert window
What I found so far exploring the source code is that the result image items URL links are encrypted and not showing the real URL of the image.
The following code is the result of searching the same dog using my custom search engine with Google's API and Google image search web page.
The img result using my custom search engine
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQmjyo4iFP_SQ-a2u7piFW8hZ_J4CEtDMF6_dE8Ev-RvqcZlA93DIo6uQo" title="How dogs contribute to your health and happiness" class="gs-image gs-image-scalable" style="width: 126px; height: 84px;">
The img result using Google's web image search
<img class="irc_mi" src="https://cdn1.medicalnewstoday.com/content/images/articles/322/322868/golden-retriever-puppy.jpg" onload="typeof google==='object'&&google.aft&&google.aft(this)" alt="Image result for dogs" width="529" height="353" style="margin-top: 0px;" data-iml="1552180024897">
Note that src parameter in one is encrypted and not in second one. If I do the same search on Google image I can get the real URL from the src.
So my question is: How to get the real image URL using Google's CSE? Is there any way I can get the original URL?
I have gone through this the documentation https://developers.google.com/custom-search/v1/cse/list but is not clear to me how to implement the Optional query parameters. Maybe with "linkSite" query parameter?
Best regards and have a nice day!
I am trying to add google maps Embed API to my site. I keep getting this error:
"The Google Maps API server rejected your request. This IP, site or mobile application is not authorized to use this API key."
The API key is correct. I have Static Map turned on. Two of the most common trouble shots.
Code is formatted as follows:
<iframe
width="600"
height="450"
frameborder="0" style="border:0"
src="https://www.google.com/maps/embed/v1/place?key=XXXXXXXXXXXXXXXXXXXX&q=Space+Needle,Seattle+WA">
</iframe>
I put the < infront of iframe in my code. Any help would be great. Thanks!
Any one have any suggesions?
Static Maps and the Embed API are different things and controlled differently. Do what the message suggests (in its round about way) and turn on the Embed API in the Google API console.
Google Maps Embed API
Static Maps API
I found that the placeholder in Google's HTTP referrers inputs of <https (or) http>://*.example.com/* are misleading, because it suggests that the whole <https (or) http> thing is parsed as some actual "or" statement. In reality, it is not.
You must specify your protocol exactly, such as https://*.example.com. And, if you need support for both protocols, you must specify them as unique rows.
Hope that helps someone out there.
I've built a Rich Media Card WeChat response to a location event that populates the URL parameter with a Googlemaps URL including the Lat/long values from the location response
like this
$return ='<xml>
<ToUserName><![CDATA[' . $xml->FromUserName . ']]></ToUserName>
<FromUserName><![CDATA[' . $xml->ToUserName . ']]></FromUserName>
<CreateTime>' . mktime() . '</CreateTime>
<MsgType><![CDATA[news]]></MsgType>
<ArticleCount>1</ArticleCount>
<Articles>
<item>
<Title><![CDATA[Your Location]]></Title>
<Description><![CDATA[Click this card to demonstrate the mapping functionality]]</Description>
<PicUrl><![CDATA[http://www.foo/WeChat/images/map.png]]></PicUrl>
<Url><![CDATA[https://www.google.com/maps/#'.$xml->Latitude.','.$xml->Longitude.',13z]]></Url>
</item>
</Articles>
</xml>';
The Latitude and longitude variables are populated correctly
If i output the URL it is well formed.
however when I click the link Wechat opens its browser and attempts to load the URL but no map is displayed.
Is there something I've missed?
Thanks
All seems good. Tested on IPhone. Ensure it is working on the native browser outside of WeChat. If that is working then please post a screenshot here of what you are seeing in the native browser and in WeChat as well as the final URL
I am creating an app that uses google map. i inserted the map api key inside the html page.
<script type="text/javascript" src="https://maps.googleapis.com/maps/api /js?key=AIzaSyDcvUkjiKRkJ2zV8cYElZy55JLZDjiL9g8&sensor=false"></script>
i keep getting error saying " Google has disabled use of the Maps API for this application. The provided key is not valid Google API key, or it is not authorized for google Maps Javascript API v3 on this site ". i just followed whatever they had mentioned in here
https://developers.google.com/maps/documentation/javascript/tutorial#api_key
i don't have any problem when run this code in my html. Only problem is that some of the map page don't render out properly. Which version is better to use V2 or V3 ?
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
i am kinda confused. Can someone help me out what i doing wrong or what do i need to do. Since my app is totally based google map. Thanks
I see two possibilities for you:
Either you use this line in your code <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=CHANGE_YOUR_KEY_HERE&sensor=false"></script> and you generate a new key for you application: https://developers.google.com/maps/documentation/javascript/tutorial#api_key
(on the screenshot you can see the link "Generate new key...")
Or you use this line without bothering with having a key. (for example: http://jsfiddle.net/LZmQ2/)
I have tried, but without any luck.
Bootstrap provides this really awesome theme called Stylish Portfolio (http://startbootstrap.com/stylish-portfolio) which comes with a cool Google-map location.
This is a fairly standard thing nowadays. However, I need to change the location of the map to match Copenhagen in Denmark.
I've tried to look up other ressources/help/support from the template creators, bot cant seem to find anything on the map coordinates - which is why I'm here at SO now.
I've been looking through the html, and this seems to be the code for the map?
<!-- Map -->
<div id="contact" class="map">
<iframe width="100%" height="100%" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Twitter,+Inc.,+Market+Street,+San+Francisco,+CA&aq=0&oq=twitter&sll=28.659344,-81.187888&sspn=0.128789,0.264187&ie=UTF8&hq=Twitter,+Inc.,+Market+Street,+San+Francisco,+CA&t=m&z=15&iwloc=A&output=embed"></iframe>
<br />
<small>
</small>
</iframe>
</div>
<!-- /Map -->
Clearly, it's not just a simple google-maps link/coordinates - can somebody help explaining to me, what I'm actually looking at here?
Thanks in advance
The solution to your problem is quite easy...
Follow these steps:
Go to https://developers.google.com/maps/documentation/embed/start
Search for business or place (where it says "Highlight a place or an address") then click "Looks Good!".
Enter your API key, if you dont have an API key follow the istractions bellow and create one (API key), if you have an API key skip steps 3.1, 3.1.1, 3.1.2., 3.1.3., 3.1.4.,
3.1 Creating the API key
3.1.1. Visit the APIs Console at https://code.google.com/apis/console and log in with your Google Account.
3.1.2.Click the Services link from the left-hand menu.
3.1.3.Activate the Google Maps Embed API service.
3.1.4.Click the API Access link from the left-hand menu. Your API key is available from the API Access page, in the Simple API Access section. Maps API applications use the Key for browser apps.
Your API key looks something like this: AIzaSyCwI3k7JC29_KzlX1S_bC8fARpocLX5bRY
After you ender your API key click "DONE"
Copy And Paste the code you'll get to your templates index.html and you're done.
Change the height and width to 100% (where is says
That's all!