Thanks. We had discussed a couple weeks ago how to handle displaying multiple polygons on a map from the database. Any updates on that?
Can you remind me! sorry I forget stuff all the time!
You can have multiple polygons on the map, you just can’t draw them all in a list at the moment.
You’re not the first person to ask so I’ll take a look at it next week.
Yup, I was interested in the ability to show a map and draw one or more polygons that the user has saved
I’ll see what I can do. I need to think about the configuration that each shape has and what shapes are being drawn. Not making any promises but I’ll have a look at it. I assume if you had 50 shapes for example, each one would have identical config? Take a look at using the Javascript to Bubble element in the meantime because you can use that to iterate over a list of things and incrementally decrease the count within the event it triggers. Inside that event would have the Draw shape action. It’s a bit fiddly to setup but it will work.
Hi Everyone,
Jumping in here as I might have some info that may help.
I use this plugin very extensively with saving & loading shapes and markers with the database. Here’s a breakdown of how I currently do it.
Important Notes:
- Save your shapes you will load to the database with all the data you will need to draw it again AND its shape type (rectangle, circle, polygon, etc).
- Have a custom state on the page I call it “User Drawing” and it defaults to “no”. This helps us determine if the user or database is drawing a shape.
Page load
- On page load, I iterate though the list saved in my database “Drawn map item” using the list shifter plugin and the workflow its iterating over has conditionals for each shape type such as “only when this drawn map items shape is circle”. Essentially this runs “Draw shape” many times all with the dynamic values that are saved.
- Once that’s complete, we have all the shapes drawn up from the database and are ready for the user to begin drawing/editing so we set “user drawing” to “yes”.
User drawing
- When a user draws a shape the plugin calls “a shape has been drawn” I have it set for only when User drawing is “yes”. This way we only save to the database when a user is drawing and NOT on page load.
- So “when a shape has been drawn” AND user drawing is “yes” we save the relevant info to the database.
- My “drawn map item” thing has many fields but mainly 1 field for each option in the “draw shape” or “set marker” actions.
Hope this helps!
@pork1977gm if you want to implement loading shapes I would love to see that happen. I’m sure whatever you come up with will be faster than the list shifter plugin. I have 13 actions working within 2 workflows at the moment that handle page load. We can chat more if you want any info.
As always my favorite plugin!
2 Likes
Thanks so much for sharing this. Some food for thought: After a lot of fussing, I settled on using @gaurav’s excellent Env Variable plugin to streamline my workflows significantly. I created a variable for each set of shape coordinates (polygon, rectangle, etc.), bound these to the states output by the W3W plugin and then set workflows to trigger whenever these coordinate variables change. The beauty of this setup is that it accounts for any user action that might cause a shape’s coordinates to change (rotating, dragging, resizing, drawing, etc.).
2 Likes
@pork1977gm I had a very quick question: I’m wondering if there is any way to prevent the polyline coordinate points from showing when the shape is not active. When drawing complex lines and later rendering them on a map, the effect is rather unattractive (see below). Is there already a way to do this, and I’m just missing it?
Ok, I’ll create an action called ‘Set list of shapes’ to sit alongside the ‘Set list of markers’ that’s currently available. It’s now on my list of things to do.
I’ll implement a ‘loading shapes/markers’ state with a default value of No. When either a list of markers or shapes are being processed, it will get set to Yes and when all items have been processed (or added to the map), it will get set back to No.
The run up to Christmas is pretty busy for me at the moment so I’m not sure I have the time to do it immediately, but I will get it done and let you know when it’s ready and documented.
@ts11 - In that action you run to create that polyline, there should be an option in there to make it editable, set that to No and all those dots will vanish. They’re only there to give a point to click on and resize. If it’s not there, send us a screenshot of the action.
@justinnnnnn - Thanks for providing that info, helpful as always 
Paul
1 Like
hi @justinnnnnn
Thanks for putting detail here. I have one question-
Is it possible to draw the shape on google map even when is not zoom level > 15? and get the lat and long of the shape?
Hi @ankur1 ,
You should be able to draw a shape and get the same results with zoom level set to 4 or 19 for example.
On my app I just drew 2 shapes; 1 all the way zoomed in and one all the way zoomed out (4)
@pork1977gm I’m struggling a bit with some of the KML actions. I’ve created a workflow that extracts shapes from a KML file and then iterates through each of the supplied states, drawing the shapes on the map via their extracted coordinates. The challenge is that the states don’t seem to be populating after I run the initial “extract shapes” action. When I run the workflow in debug mode, they show as “empty,” even though the file does contain valid shapes. Do you know why this might be?
Ah ok, I didn’t add an event for this action to know when it’s completed so I’ve just done and pushed an update. It’s called KML extract completed so put everything from step2 into that event and hopefully it work.
I think the problem here is that step 1 needs a little time to execute so the lists were probably empty in your other steps.
1 Like
Hello! I am setting up the following flow:
Create a property, draw a polygon and save those coordinates.
Then on a listing page, show the map with those coordinates as a drawing.
Everything is working fine but I receive this error message:
It’s weird because it is loading the actual polygon on the desired spot (even though it is all black when I set it up to be blue).
Any idea on how to fix this? Thanks!
Excellent! Thank you so much.
1 Like
Hi @nuttnest
Are you able to send me the URL to the page it’s happening on? I wouldn’t mid checking some things to figure out what’s going on.
Paul
Yes, I sent it to you via message
1 Like
Thanks, the error you were seeing is now fixed. I wasn’t parsing the latitude/longitude as numbers when using the dynamic options in the way you were, so update pushed for that.
The black polygon you’re seeing when running the Draw shape action, is being caused by setting the color variables inside bubble’s color picker which is really weird, I may have to make some adjustments because I bet the value is coming through differently when compared to selecting a color.
I’ll get that fixed anyway.
color variables are now fixed but I haven’t pushed an update yet. I want to go through the whole plugin and make sure all of the color fields can handle it. Will let you know when it’s ready.
update pushed now so you should be good
let us know if you run into any other problems
Hi @pork1977gm
Is there a way to use the “Do a search” function in Bubble to return addresses from a database that fall within a polygon that has been drawn on the map? I have seen you answer questions about the contains location feature in the workflows, but that wont work with the way my app is set up.
The database contains public property data that all users will be able to see, therefore I cant modify each record for a polygon that is drawn for a specific user.
Is there a way to do this in the do a search functionality along with other criteria it is searching for (such as bedroom count, square footage, etc).
Each thing in the database contains a geographic address, as well as a latitude and longitude, for each property.
Thanks for any help you can provide!