# Adding a Hyperlink to Markers on Google Maps

**URL:** <https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294>\
**Category:** Questions about Thunkable X\
**Tags:** googlemaps\
**Created:** [January 26, 2019, 3:33pm UTC](https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294 "2019-01-26T15:33:53Z")\
**Posts on this page:** 15\
**Page:** 1

<div class="post-metadata">

**Author:** ![Sparrow](https://avatars.discourse-cdn.com/v4/letter/s/9f8e36/32.png) [@Sparrow](https://community.thunkable.com/u/Sparrow)\
**Post date:** [January 26, 2019, 3:33pm UTC](https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294/1 "2019-01-26T15:33:54Z")

</div>

Hey All,  
I’m working on an app that includes a Google Maps feature with markers on predetermined locations. When the user clicks on a marker, I want them to be directed to that specific location’s website. For now, all I can do is, using the “when map on calloutpress,” assign one link for all the markers. How do I add different links for each location?  
Thanks for your help!

---

<div class="post-metadata">

**Author:** ![Evelyn\_Olson](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/evelyn_olson/32/31640_2.png) [@Evelyn\_Olson](https://community.thunkable.com/u/Evelyn_Olson)\
**Post date:** [March 24, 2020, 6:01am UTC](https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294/2 "2020-03-24T06:01:09Z")

</div>

Have you found a solution so far? I’m working on something similar and I’m having the same issue.

---

<div class="post-metadata">

**Author:** ![manyone](https://avatars.discourse-cdn.com/v4/letter/m/ee59a6/32.png) [@manyone](https://community.thunkable.com/u/manyone)\
**Post date:** [March 25, 2020, 8:53am UTC](https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294/3 "2020-03-25T08:53:56Z")

</div>

here’s one way of handling a markerpress. match the coordinates returned by the get\_property calls, to the ACTUAL coordinates defined for the marker in order to determine which marker was pressed. then you can do the desired action.

 ![map1and2](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/d/d/dd65bb947b03b67089a13a245b84922fb0d2ac34.jpeg)

---

<div class="post-metadata">

**Author:** ![Evelyn\_Olson](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/evelyn_olson/32/31640_2.png) [@Evelyn\_Olson](https://community.thunkable.com/u/Evelyn_Olson)\
**Post date:** [April 22, 2020, 3:31am UTC](https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294/4 "2020-04-22T03:31:32Z")

</div>

Is there any other way to do this? I have 85 different markers and this would be way too many pages.

---

<div class="post-metadata">

**Author:** ![henrikhngj5](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/henrikhngj5/32/67710_2.png) [@henrikhngj5](https://community.thunkable.com/u/henrikhngj5)\
**Post date:** [April 22, 2020, 7:16am UTC](https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294/5 "2020-04-22T07:16:28Z")

</div>

I do this in my app, however, the on Callout clicked does not work on iOS…just saying…

---

<div class="post-metadata">

**Author:** ![manyone](https://avatars.discourse-cdn.com/v4/letter/m/ee59a6/32.png) [@manyone](https://community.thunkable.com/u/manyone)\
**Post date:** [April 22, 2020, 8:00am UTC](https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294/6 "2020-04-22T08:00:49Z")

</div>

the idea is to keep your marker data in a table (local storage, airtable, firebase) and you would use a loop to go over the stored marker data, obtained as a list, and match that against the latitude and longitude values returned by the marker press block. you just have to make sure that values used in defining the markers are exactly the same values stored in the table, or if you want fuzzy matching, you may have to round down the to values to 2 or 1 decimal place/s.

---

<div class="post-metadata">

**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\
**Post date:** [April 22, 2020, 12:21pm UTC](https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294/7 "2020-04-22T12:21:17Z")

</div>

This is a cool idea! But what OP was asking about is how to handle onCallOutPress and not onMarkerPress

---

<div class="post-metadata">

**Author:** ![manyone](https://avatars.discourse-cdn.com/v4/letter/m/ee59a6/32.png) [@manyone](https://community.thunkable.com/u/manyone)\
**Post date:** [April 22, 2020, 3:57pm UTC](https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294/8 "2020-04-22T15:57:28Z")

</div>

> [@Sparrow](#):
>
> When the user clicks on a marker, I want them to be directed to that specific location’s website.

i thought the requirement was for a specific marker?

---

<div class="post-metadata">

**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\
**Post date:** [April 22, 2020, 5:38pm UTC](https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294/9 "2020-04-22T17:38:16Z")

</div>

You’re probably right. I must have misread the post in haste. I now see that’s what they _could_ use.

---

<div class="post-metadata">

**Author:** ![Evelyn\_Olson](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/evelyn_olson/32/31640_2.png) [@Evelyn\_Olson](https://community.thunkable.com/u/Evelyn_Olson)\
**Post date:** [April 23, 2020, 10:51pm UTC](https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294/10 "2020-04-23T22:51:09Z")

</div>

Oh my, I suppose I’m a big noob to all this… can you show a screenshot or an example of what that means? Thanks!

---

<div class="post-metadata">

**Author:** ![manyone](https://avatars.discourse-cdn.com/v4/letter/m/ee59a6/32.png) [@manyone](https://community.thunkable.com/u/manyone)\
**Post date:** [April 24, 2020, 7:14am UTC](https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294/11 "2020-04-24T07:14:45Z")

</div>

here i made an example app from my demo by adding an airtable and search for url on markerpress then view the url in webview  
this is what my airtable looks like:  
 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/2/1/21039a58bf621f9e262854f64f3ad2ea3c4ee927.png)  
note: **lonlat** is a concatenation of the absolute value of longitude with latitude (with the assumption that all latitude values are never more than 100, which applies to continental US). on marker press, i recompute this from the returned lat and long returned from markerpres so that i will do a search on one column only (ie. lonlat) instead of matching latitude and longitude… ( i’m not sure if it really saves any time!)  
and the app in action:

 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/5/f/5f341b8f7d9b46e827153b9fef37f057f902c0da.jpeg)

here’s a copy of the project (with api and database id blanked out)  
[https://x.thunkable.com/copy/1a7bc591e787af454e2b6ae1d8fec5bd](https://x.thunkable.com/copy/1a7bc591e787af454e2b6ae1d8fec5bd)

---

<div class="post-metadata">

**Author:** ![domhnallohanlon](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/domhnallohanlon/32/29554_2.png) [@domhnallohanlon](https://community.thunkable.com/u/domhnallohanlon)\
**Post date:** [April 24, 2020, 9:05am UTC](https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294/12 "2020-04-24T09:05:11Z")

</div>

This looks great @manyone,

Thanks for sharing!

---

<div class="post-metadata">

**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\
**Post date:** [April 24, 2020, 11:47am UTC](https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294/13 "2020-04-24T11:47:11Z")

</div>

This is cool. I still wonder about “onCalloutPress”. This does nothing for me on iPhone.

Does anyone have a working example of some action occurring onCallOutPress

OnMarkerPress works just fine for me.

---

<div class="post-metadata">

**Author:** ![henrikhngj5](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/henrikhngj5/32/67710_2.png) [@henrikhngj5](https://community.thunkable.com/u/henrikhngj5)\
**Post date:** [April 26, 2020, 9:37am UTC](https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294/14 "2020-04-26T09:37:30Z")

</div>

Hi Jared, this was the issue I reported earlier on the thread.

OnCalloutPressed does not work on iOS - the event does not contain the native event which is needed to get the location.

Android is fine for this.

---

<div class="post-metadata">

**Author:** ![ioannis](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/ioannis/32/146956_2.png) [@ioannis](https://community.thunkable.com/u/ioannis)\
**Post date:** [November 8, 2024, 11:31am UTC](https://community.thunkable.com/t/adding-a-hyperlink-to-markers-on-google-maps/66294/15 "2024-11-08T11:31:48Z")

</div>


