Map based functionality - drop pins, add dynamic shapes

Hi all,

I am looking to add some map based functionalities to my app I am building and any help is greatly appreciated.

  1. I would like to add pins to a map similar to how it is done in Apple maps or Google maps by clicking, double clicking or tap & hold on mobile. Is this possible with the standard Google maps bubble functionality or is there a plugin that can perform this?

  2. the ability to add a circle shape as a layer on the map. I would like the radius of this circle to be defined by the user (either by check box or slider). Ability to add the circles to the map in the same way that the map pins are added in point 1 above. If the shapefiles could be saved to the database as well that would be great.

  3. Once the circle with radius are defined on the map, if there are any map markers that are in the database within that circle radius, I would like them to be displayed in a repeating group below the map.

  4. ability to add spatial files like shape files to a map. e.g. State borders, lake outlines etc which can be clicked as an element with a workflow in the map.

Any help being directed towards any plugins, workarounds etc I will be very grateful for!

Thank you
Scott

1 Like

Hey Scott, I’m wondering if you ever figured out how to accomplish the functionality you describe in your post. I would like to be able to click the map to add a pin, and then run an action upon dropping the pin. Please let me know if you’ve figured that out!

1 Like

Hello @alexgquintana welcome the community,

I just replied to a similar inquiry a few mins ago. Perhaps this video can help

1 Like

Hi @cmarchan, thanks for responding. Though that video does not answer my questions. I was wondering if I can create a way to interact with the map, meaning you click on the map, and then the address value of where you click can be saved or used, the way it works in normal Google Maps.

1 Like

Hi Alex - sorry for the delay on this reply. I didn’t work out the way to do it exactly like I was hoping, however I did manage a workaround that enabled me to drop a pin on a map. The way I did it was by using a button/icon that when pressed set the center of the map as the marker pin address. Another way I made it work was by setting up a custom state where the value type was a geographic location and I was setting the state by clicking the button/icon and the value of the custom state was the map center address. If this sounds like it could work for you I could give you more detail if needed. Cheers, Scott.

1 Like

@scott.ETK - did you ever figure out #2 of your questions? I have the same question. Thanks

Hi Aniju,

Unfortunately I did not but I kind of changed the design to not include this feature.

One way it may be possible though which I never tried but see how it could work is with a plugin called Google Map BDK plugin

Google Maps (bdk) Plugin | Bubble

You can display KML files which could be preloaded into the database and use conditiontional statements to display them for users.

I haven’t done this but it may be worth some investigation for you.

Scott

1 Like

Can anyone share experience with Google Maps (bdk) Plugin here on Bubble?

Maybe sharable link, to see the plugin in action?