Services Plugins FAQs

MapBox: Speed not working

Hi

I can’t get map speed variable to work. Hejst to do?

1 Like

Hi @siticum ,

To streamline our communication, please let’s consolidate our conversation into a single thread, since all your queries pertain to the Mapbox Maps plugin. For now, I will respond to each thread individually, but moving forward, please reply in just one thread of your choosing. Thank you for your cooperation. :pray:

Regarding the “Speed” state, I’ve also noticed this problem and it seems it may have been overlooked in the plugin code before. Could you let us know how you intended to use this state, so we can further explore the possibility of including such feature in a future update.

Thanks again,

Best,
Stefan

Okay. Its very much needed. I know that your recently acquired Leafy Map have it working and working well. That plugin cant do for us all all though.

We need the Speed variable to adjust both the map zoom level, once the user is in “full auto navigation mode” and to adjust the distance at which our app finds and plays stories. Eg. waling will only play stories in the near vicinity (100 m), while traveling by car, will play stories further away (2 km).

The latter is crucial to the app.

We will need it several places in APIs defining minimum and maximum distance to POIs, both on the map, and off the map.

As you suggested, I will add new bugs in this thread to keep them collected.

We would like to add makers as clusters to avoid excessive memory usage. However the workflow action is missing both marker SIZE and marker ANCHOR. The add list of markers has these two settings added.

Adding this will also be a big thing for us. Having 100+ markers crashes the app. It doesn’t happen using clustering.

See screenshot without the anchoring and size setting:

Hi @siticum,

Thank you so much for your appreciation of Leafy Maps. We’re currently working on further improvements as well.

From your first message, it seems you need the route distance you’ll be traveling. You can easily obtain this from the Mapbox states or the “Get route data” API call. However, it’s not entirely clear what specific speed information you’re looking for. Please clarify, so we can check the Mapbox documentation to determine if it’s possible to add.

Regarding the Cluster Markers, they can indeed be very helpful for displaying a large number of markers more compactly. We’ve recently added several improvements to the cluster functionality, allowing more settings to be adjusted. For Cluster size and anchor, the size in this action will always be 1:1 due to library constraints. Therefore, you should predefine the image sizes in the database to ensure they display correctly on the map. Concerning the anchor, I’ve forwarded this to our development team for review and potential addition.

I hope this clarifies everything. If you have any other questions, please let me know.

Thanks, and I look forward to your reply.

Best regards,
Stefan

Thanks for your quick reply and info.

CURRENT USER SPEED: We need the current speed at which the user is traveling. I am currently displaying it from the MapBox state “Speed” but it is not working as you mention. LeafyMap has a similar state which does. It does not relate to route data. If MapBox cant provide the user speed, its might be possible to add this to the plugin using another API?

CLUSTERING MARKER SIZE: Argh. That’s too bad as it will make them pixelated and not suitable for our use. Is there anything else you can to? - Considering it can be done in lists and single markers, it seem vary strange that it cant be done in clusters. Fixing this, will also fix memory crash issues for others developers than me.

Looking at: Display HTML clusters with custom properties | Mapbox GL JS | Mapbox it seems that the HTML markers inherit their properties when using the clustering property. Not an expert in the library myself.

Thanks for forwarding the anchor addition.

PHONE TILT DATA: “Regarding your request about the phone tilt feature, could you please confim if you are talking about this feature which is present …”

Yes - I confirm. BUT it is the phone’s tilt value. The map pitch feature is already in MapBox.

NEW: SET NEW MARKER ICON: We would like to be able to replace a marker icon, or rather display another once a marker is pressed in our native app. Instead of adding “remove marker” and “add marker” which is cumbersome and slow, it will be great with a WHEN MAKER IS CLICKED trigger, and a REPLACE MARKER ICON action.

1 Like

Hello @siticum,

Thank you for your message and for providing detailed explanations.

We have addressed each of your concerns and will provide specific answers for each:

Regarding the current user speed, I have noted your request and forwarded it to our development team for further examination and resolution.

Concerning the cluster marker size, cluster markers function differently from simple markers. We have recently introduced the possibility to use images instead of points. However, these will be displayed on the map at the same size they are in the database. You can use a third-party tool to resize the icons to your desired display size. Additionally, in the “Add list of markers” action, images for the markers are loaded at full size and then resized using CSS, meaning the size there doesn’t have any impact on memory usage.

Regarding the phone tilt and anchor, these issues are currently under review by our developers, and we will inform you as soon as there are any updates.

As for your questions about “SET NEW MARKER ICON”, there is an event called “Cluster Marker Clicked” that you can use in your workflow when you click on a cluster marker. Regarding setting marker icon, we have previously explored this, but it functions differently in Mapbox compared to other elements in Bubble that are directly connected to the database. Changes in Mapbox require updates in the database, followed by removing and re-adding clusters. These actions run quite swiftly even with a large number of clusters present, without causing too much visual problems on the map. You can view this working in this Loom video [link].

I hope this clarifies your concerns. Please let me know if you have any further questions or need additional assistance.

Thanks, and have a great day ahead!

Best regards,
Stefan

USER SPEED: Fantastic. Thanks

CLUSTER MARKER SIZE: Good to know regarding memory usage.

If the markers are resized on the Add list of markes… action using CSS, why not add that resizing setting to the clustering as well? I can’t be the only one that need this and it could be considered a design flaw.

SET NEW MARKER ICON: Okay. Will do for us. The approx. 50-100 ms delay can be handled by adding the new marker(s) on top of the old, then removing the old marker(s). Apricate the info.

MAP HEADING AND MAP HEADING CHARACTER: From the other thread, I have further tested getting data from the MapBox heading and heading character states. I had it working once last week using the compass plugin using the Request orientation, then Resume orientation. But cant get it to work anymore.

Its still says Heading supported = No. We will need this in the app, and its seems to be a permission bug of some sorts. Also, a dedicated Request orientation action would be great.

See the video, where the marker heading is working, but the state is not populated: iCloud Photos - Apple iCloud

Best regards,
Sejr

Hello @siticum ,

Thank you for your message and all the observations observations.

Regarding the cluster marker size, I will forward this to the development team for them to explore again the possibility of incorporating it. I will share feedback as soon as it becomes available.

Regarding the map heading and heading characters, after further testing, it indeed appears there are some issues specific to iOS devices related to the requesting orientation. Using the steps you provided with the Compass plugin, I also managed to make it work after a refresh. This has also been forwarded to the dev team to identify the cause, and a dedicated Request orientation action will be considered for this case.

Thank you again for your valuable input. If there is anything else you need help with, please let me know.

Thanks and have a great weekend ahead!

Best regards,
Stefan

Thanks so much @Stephan! Really appreciated. Each bug fix and improvement makes our app better, and more fun to work on.

Enjoy the weekend once you are off work!

Cheers

1 Like

One final requests, before the weekend on my end.

STATE WITH LIST OF ADDED MARKER IDs:

Having a state on the MapBox element with a list of markers ids on the map, enables us to keep tack off, and check against which makers is added. This makes removing and adding new markers much easier. The Google Maps Extended (not Zerocode’s version) plugin has this, which we at the time found very handy.

GET CLICKED CLUSTER MARKER LAT + LON:
Having 2 states on the MapBox element with cluster marker lat and lon, makes it tremendously easier for us to show details for each marker and save a couple of API calls.

SETTING CLUSTER FONT COLOR:
We would like to use dark colors for the cluster circles with awhite font color. Current the font color is fixed to black. Any chance you can add a field for thefont color selction?

Testing further with clusters and lots of markers, fixes out big headache. The app does not crash anymore :slight_smile: - Would really like to get it working well.

Cheers

1 Like

Hello @siticum,

Thank you for your message and valuable feedback. :pray:

The enhancements you’ve suggested will indeed be very beneficial for the plugin. Some of these improvements are already prepared, and they will be included together in an upcoming release.

Regarding your queries from the last message:

STATE WITH LIST OF ADDED MARKER IDs:

There is currently a state called “Created Cluster ID”, which provides the ID set by you in the action[image]. To remove clusters, you simply need to input this ID into the “Remove Clusters” action[image]. Additionally, to access the data of clusters on your map, you can search using the same source/constraints you used in the action to add the clusters.

GET CLICKED CLUSTER MARKER LAT + LON:

This functionality is fully supported. You can obtain all necessary details from a clicked cluster using the “Clicked cluster marker data” state. Just specify in the action which field this state will display[image]. And if you want to retrieve all the data about the marker, you can for example apply a data constraint to access complete information about that specific markers[image].

SETTING CLUSTER FONT COLOR:

At present, it’s indeed not possible to customize the font color. And I have relayed this request to our development team as well for the future version.

It’s great to hear that using clusters has significantly saved memory and resolved the issue with crashes, especially since they are designed for displaying large numbers of points.

I hope this information is helpful. Please let me know if everything is clear or if you have any further questions.

Thank you again for your valuable input. Wishing you a fantastic start to the week.

Best regards,
Stefan

Hello @siticum ,

I hope you are doing well.

I’m reaching out to see if you were able to use the suggestions from our last correspondence regarding the “Created Cluster ID” and obtaining cluster marker data. Additionally, I’m excited to inform you about the new version of the Mapbox Maps plugin—version “1.141.0”. We’ve implemented several improvements based on your feedback:

  • We’ve fixed the “Speed” state - now, you can accurately track the speed of a moving user.
  • Added an Icon Anchor field for the Create Cluster action.
  • Introduced the “Request Orientation Permission For iOS” action, similar to what is available in the Compass plugin.
  • Added a ‘Turn on mobile compass’ action and the ‘Compass’ state, enabling you to use compass mode similar to Google Maps. Please note that for iOS devices, you must first use the “Request Orientation Permission For iOS” for it to function correctly.

The font color option for the Clusters will be available in the next plugin version. Regarding the icon size limit, I have forwarded your request then to the development team. However they are interested in understanding more about your use case to guide you in preparing a workflow or using a plugin that helps in preparing images before uploading them to the map, as adding such feature could potentially cause stability issues for other users, thus preparing the images beforehand would be a much greater solution. :pray:

Hope you find this information helpful, please let me know about your thoughts or feedback you might have.

Thank you again and look forward to your repl.

Best regards,
Stefan

Hey. First off, this is amazing. Let me go through each feature one by one. As I am on holiday this week and not by a computer, it has been limited what I can do in terms of testing from my iPhone . What I found so far:

See screen recording: iCloud Photos - Apple iCloud

Cluster anchor: Working - Well done!

Cluster font color: Working well! but not with overlapping markers nearby. This is not important for us though.

Speed: Working very well! Nice.

Compass mode: This is awesome, and working much better then I expected. Super smooth. However it locks at an odd bearing when using compass mode then tracking. This might be because of my setup. Will have to test further. But so far this is amazing. With this, I don’t need to have a workflow running every 0.2 sec burning Workload units and battery life on the phone.

Add action: turn off compass mode: we would like to turn off the compass mode with an action as well. That way pressing “stop” auto in our app, will stop the map from syncing with the compass. There might already be a way to do this?

Getting data from cluster markers: cant test this on my phone. Will need to do it on a pc.

Cluster maker size:

The use case is simple. Have high resolution markers clustered.

Same sizing as adding a list, just clustered. We can downscale the icons easily using uploadcare (the cdn we use for generating makers) but the resolution will be horrible on mobile devices. We tried that, and it wont go with our users. Everyone expects high resolution markers today in mobile apps.

So… if there are someway of turning cluster markers sizing on and off (if it destabilizes the plugin) or doing it with an add on, on the map itself to retain high resolution markers. Eg. With CSS.

Or consider adding it as an “experimental mode”.

However, we need it to integrate seamlessly and the correct markers size shown instantly once the user zooms in on a cluster.

See video.

We are currently using a size factor 0.3 for our markers. If using 1:1 they are pixelated.


Should look like this: Just clustered.

Best
Sejr

1 Like

Hello @siticum,

Thanks for sharing your thoughts and feedback with us.

It’s great to hear that the new improvements are working well for you and that you’re enjoying them.

Regarding the overlapping markers, you have the option to set the Cluster max zoom in the action. This field allows you to set the map zoom level at which the clusters will disappear and only the markers will be displayed. For example, at a zoom level of 5, there will be no more clusters, only markers.

Regarding Getting data from cluster markers: please test this and let me know if you have any questions or need help setting it up.

As for the compass mode, it can be turned off by a simple click on the map. This feature is designed primarily for visualization, and is working similar to Google Maps. However, regarding the bearing, let me check with the development team as the heading is indeed not straight when you start using it, and you cannot use the “Set bearing” action there.

Concerning the icon sizes, I have tried to reopen discussion on this topic and to push for adding this feature, but it was decided again not to add it due to previous mentioned concerns. For your use case, you might find tools or plugins helpful, such as “Image compressor and uploader” where you can resize images beforehand without losing quality. You can also subscribe and test it out, incurring charges only for the days you use it.

I hope this information proves helpful to you. Please let me know if everything is clear and if you have any other questions.

Thank you once again and I look forward to your reply.

Best regards,
Stefan

Hi @Stephan

Thanks for the info. It will test it and let you know.

Olso thanks for trying again with the development team. I hope they will reconsider or add a “add on feature” that can be turned on or off to retain plugin stability at a later point.

In terms of resizing the map cluster icons. How do we retain the marker resolution?

Can marked be resized on the map with JS?
How do we do this.

It looks like the plugin you suggest resizes the images. This we can already do, but won’t work and they will be pixelated.

1 Like

Hello @siticum,

Thank you for your message.

Regarding the icon size option, if it would be decided to be incorporated into the plugin in the future, we will notify you promptly. :pray:

As for resizing images, using JS injections, as in the case of Mapbox, won’t be really effective. As when adding cluster markers to a map in Mapbox, they are typically implemented as a layer using GeoJSON data. Therefore, any changes to them should be applied before using the plugin.

Regarding the “Image Compressor and Uploader” plugin, you have also the option to set the quality of the output image during resizing there. And to ensure it suits your needs, you might consider subscribing and testing it out to make sure it meets your requirements without incuring too much cost. Additionally, there may be also other tools available that could help you resize images effectively.

I hope this information is helpful. Please let me know if you have any other questions.

Thank you again, and I wish you a great start to the week. :star2:

Best regards,
Stefan

Hi @Stephan

Thanks for the info :pray:

Here a more feedback and a request for an action.

__
PIXELATED CLUSTER MARKERS
It looks like the plugin you suggest only resizes the images. This we can already do using a free CDN, but it won’t work and they will be pixelated.

Would it be possible to make the same Cluster layer using the custom geoJSON fields in the Create cluster action?

__
UPDATE: GETTING DATA FROM CLICKED CLUSTER MARKER
Working like a charm, thanks.

__
COMPASS MODE, BEARING ALIGNMENT
Using the “turn on mobile compass” mode, still locks the heading at an odd angle. See video: iCloud Photos - Apple iCloud

I see a note: image, but the miss alignment still happens, making the feature a bit useless. I hope your dev team can fix the bug.

__
ACTION REQUEST: TURN OFF COMPASS
Turning on compass mode works, but we need to turn it off again using an action. To see the use case: try StoryPilot on the App Store (apple.com) and press “Start” then “Stop”. Please add a “Turn off compass”.

__
STATE REQUEST: COMPASS MODE IS RUNNING

And, for our map controls and UX to know weather the compass mode is on or off, a state on the mapbox element with “Compass mode is running” would be great as well. Please add this also

__
COMPASS MODE + TRACKING
We want to use compass mode while also using tracking (atuomatically panning the map as the users movies keeping the user location dot in the centre as it would otherwise do).

Without this “sync” the compass mode doesn’t resemble Google Maps "follow mode” that uses both the compass while also re-centering the map to the users location while moving.

Any chance you can fix the bug that “disengages the tracking” once compass mode is on?

__
CONTROL BEARING AND PITCH ACTION SPEED
To further improve the UX of the app, we would like to control the speed of which bearing and pitch are set using the “fly to action”.

Any chance you can add this to the action?

__
CUSTOM MAP CONTROLS
Celebrating the new features that you and the team added; check out our map control button in the lower left corner. :tada: :slight_smile: iCloud Photos - Apple iCloud

Happy to share the video as a gif in the bubble forum MapBox thread if you want me to.

Cheers
Sejr

1 Like

Hello @siticum

Thank you for your message and the detailed report on each of your observations.

I will respond to each of your points in the following message:

Regarding the custom geoJSON, you can also use it to create clusters on your page by creating a JSON with all the necessary information beforehand. However, it would not work with adding images, as the Icon feature was added to the plugin using custom code and is not present by default in Mapbox.

Previously, we identified that the gyroscope, which is responsible for rotating the map and determining direction in the plugin libraries, might be causing a conflict. This results in incorrect behavior of the direction arrow for some devices. Consequently, we recommend using this feature without the User heading and have also added an ‘compass_is_off’ event to track when the compass is turned off, and an action "On/off input control " which will remove the inputs from the Map element. And of course if there will be any updates from the Mapbox on this matter, we will make any needed changes and updates.

I will forward this request to our development team to explore the possibility of adding this feature.

Actually, there is already a state available named “Compass” that provides yes/no values indicating whether the compass is active.

Regarding tracking with compass mode and the bug you mentioned, could you please share more information on your use-case, such as screenshots on how exactly have you set your workflow, which actions you are using, the issue you came across and the desired output. So we can further investigate it on our side and provide a better answer.

As far as I know, the settings for bearing and pitch are already included in the action[image]. Could you please check and let me know if they work for you?

We are pleased to hear that the recent improvements to the plugin have been beneficial for your project, and we remain committed to continuously enhancing it.

Thank you again, and I look forward to your reply.

Best regards,
Stefan

Hello @siticum ,

I hope this message finds you well.

I’m reaching out regarding your request to add a “TURN OFF COMPASS” action to our plugin. First, I want to thank you for your continuous interest in enhancing our products. At Zeroqode, we continually strive to improve our offerings and value your initiative. I also need to inform you of some internal changes at Zeroqode concerning all feature and improvement requests.

To proceed with your request for new features or improvements, we invite you to sponsor the development. To kick off the review of sponsorship request, please complete this Sponsoring Plugin Features Form: Interface Form - Airtable

We will then review it and provide an estimate of the hours required and the associated cost.
Our sponsorship packages start at a minimum of 5 hours, with a rate of $200 per hour.

We look forward to collaborating with and better serve your needs.

Best regards,
Stefan