Displaying a list of addresses and current location on map

Jobs / Freelance
1

Hello I need help in displaying a list of addresses and the user’s current geographic location on map.
I have searched the forums and have not found a solution. Currently the limitation is that you can only show one type of marker on the Map. If I have some addresses in table, I can use the List, but I want to also show the Current user’s current geographic location - without having to create a new record in the table (and then deleting it later).

Here is my simple mapper application with addresses:

Is there anyway to use native Google API code and the Bubble.is map feature together?
Thanks

1 Like
2

Hi,

PM sent, Please check.

Regards
Ray

3

Use the google map extended plugin here

First add a marker with the workflow action for the current users location. Then Go to the workflows and add a list of markers from the database

1 Like
4

Thanks everyone for the help, but @duke.severn provided a solution that worked for me:

  1. Create Map
  2. Create Custom State on map, type is “geo address” and enable check mark “List”
  3. On Map set “Type of Markers” to “geo address”
  4. On Map set “Data Source” to Maps Custom State name from step #2
  5. Create Workflow “When Page is Loaded”
  6. On workflow modify custom state “Set State”, select custom state created in step #2, value is your search of addresses:plus item current geo position.

Hope that helps, here are images as I may not have my app open forever.

CustomStateGeoList
CustomStateGeoList719×811 167 KB

PageLoadLocationPlusItem
PageLoadLocationPlusItem951×404 49.7 KB

4 Likes
5

Nice solution @theloftyloom. Thanks for sharing.

I managed to make it work. However, I need to display the map marker icon in different ways. I want to use a person icon for the current geographic position and another custom icon I have for all the other places.

Did you manage to differentiate the marker’s icon?

Thanks!

1 Like
6

Any idea on how one could reset the map?
For example:
Let’s say I have the map showing the route between two points like this
image

How could I completely clear the map, including the route? If I use the clear markers workflow action, that will clear the markers but it will not clear the route image

Do you know of a way to reset the map so the old route doesnt show? Reload the page is one option to clear the route but reloading the page takes my users back to square one and I don’t want that.

7

Hey There, that option has been missed in that last release. However I did schedule the work on it to begin this Friday. So hopefully very soon. Stay tuned for an update

3 Likes
8

Hey @AliFarahat, would it be possible to add a dropdown in the map element to choose if we want to show/hide UI controls in your next update?

Have been playing yesterday with your plugin map and have missed that option.

Should be simple to add (disableDefaultUI: true)
https://developers.google.com/maps/documentation/javascript/controls

Thanks.

9

I don’t think that would be something that’s very useful. Can’t you just add a floating group that has a dropdown in it?

10

Not sure if I understand what you mean (or maybe I didn’t explain myself correctly).

But the idea is to hide the map controls (zoom, buttons…etc) only show the map:

browser
browser1080×2340 375 KB

That’s something we can’t add with just a drop-down because that feature is not built in the plugin as a property.

It’s possible to hide injecting JS but as you said you were going to push an update I tough would be useful to have this option in-built with the plugin.

Thanks anyway.

1 Like
11

Ahh ok, will do then as that’s already on my list

2 Likes
13

Hi @AliFarahat,

I think I am on the right topic to ask my question.

I am working on the info window for my markers using kind of “dynamic” html. It works great, only issue I have is how to implement that at a large scale.

If I add a list of markers to my map, I can only select a text field from the map’s type (I don’t want to store html in my database, not even sure I can since it requires rich text)

If I use list shifter to iterate the add marker event, then I get what I need but it takes quite a long time (around 2 seconds for 4 items) so I can’t take that as a solution.

Having the below rich text editor in the Add markers list action would be amazing, so I would chose “this marker’s ID’s address…”

Capture
Capture691×1259 64.4 KB

If you already thought about a easy way to do that, such as the Marker Mate plugin, I am taking. Maybe I missed something here.

14

Hey @Tomdez1989

I am sorry your facing difficulties with this. I understand your frustration but unfortunately there is no easy solution to what you need; as there is not specific way to target a mixture of a database item and an open text field in a flexible method.

I strongly recommend you use the earlier solution you suggested in toring the html in the database. You can keep the HTML in sync by having a database backend trigger that will rewrite the html as soon as the underlying data changes.

17

Hi @AliFarahat! Do you know if there is an updated way to do this or is this still the best way to go about it? Here’s my mobile app for reference. Just want users to be able to zoom into their current location in order to see their saved places nearby. Thank you!

18

Hey @Keemarley ,

Not sure I follow. What is it you need help on?