Hey all, I wanted to share how I was able to save my custom map markers in a dynamic way!
Problem
I have business users in my app, where I wanted to show their logos on a map. These are logos they upload, so I can’t control the dimensions they upload it in. As a result, almost all of the map markers were appearing GIANT on the map.
Example of this problem from an image I found in the forum:
Solution
The key to fixing this problem is to resize your map marker image at the point when it is uploaded. We want standardized sizing for each map marker; when one of my businesses uploads their logo, a map marker gets saved at precisely 48 x 48px (what I’ve found to work best).
Here’s the steps I did for my app:
- Download the plugin Croppie
- Go to wherever you’re uploading your map marker. For me, this was a popup like this.
- Add a “Croppie” element to the page (it’s the little green square there in my popup). I want circle map markers, so here was my settings:
Notice how I have it set to 48 x 48px, and it saves as a png. Important if you want circles! - Add the workflow to “Browse a Croppie”. This is what triggers when you click “Upload Logo”
- Add a workflow to save your Croppie. This is what triggers in my popup when I click “Add Logo”
- Add the workflow “When <your_croppie> is saved”. This is how you save the map marker to something, and is what triggers after the previous workflow runs. In my example, I use a search box to find the thing I want to save it to.
- Set your map marker to be dynamic. Make sure your saving it to the list of things you’re showing on your map.
There you have it! Here’s how my map looks:
