Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fixing issue 197: #202

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Fixing issue 197: #202

wants to merge 1 commit into from

Conversation

teamomiamigo
Copy link
Collaborator

Fixes #197 : Improve Pin Clustering and Selection on ExploreScreen

The goal of this PR is to enhance the functionality of the map on the ExploreScreen by introducing clustering behavior for pins and improving the usability of selecting individual pins. When multiple pins overlap due to being in close proximity, they now form a cluster, which the user can click to zoom into. Once zoomed in, individual pins can be selected, and their associated notes are displayed correctly in the horizontal scrollbar.


Why Was It Changed?

Previously, users experienced confusion when trying to interact with pins that overlapped on the map. Clicking on one pin could result in navigating to a different pin or just taking it to the ocean, displaying incorrect notes in the scrollbar. This made it difficult to explore notes effectively in the map.

By implementing clustering and improving pin selection behavior, the map becomes more intuitive and user-friendly, ensuring users can focus on their ethnographic work without navigation issues.


How Was It Changed?

Clustering Behavior:

  • Pins that are close together in a zoomed-out view now form clusters.
  • Clicking on a cluster zooms into the area to reveal individual pins.

Pin Selection:

  • Users can select individual pins once the cluster is expanded.
  • Clicking on a pin fetches and displays the correct note in the horizontal scrollbar.

Code Updates:

  • Added a haversineDistance function to calculate proximity between pins.
  • Updated onMarkerPress to handle clustering and selection logic.
  • Modified MapView settings to animate zooming into clusters and ensure individual pin selection works seamlessly.

Styling Enhancements:

  • Introduced a clusterMarker style for clustered pins.
  • Adjusted the pin animation for improved visibility during selection.

Test Cases:

  • Validated that clusters zoom in correctly when clicked.
  • Ensured that individual pins fetch and display the correct notes.

While the idea and functionality seems to be able to work and theoretically works, I was able to update some of the functionality, but I added a little more and started coming across the same issues, attached below. I am creating this PR after trying 3 different methods to solve this problem and spending many hours, but I hope to show any additions and changes that I make to this code as soon as possible and can completely solve it.

Screenshot 2024-11-16 at 7.31.34 PM.png

Screenshot 2024-11-16 at 7.33.28 PM.png

Copy link
Collaborator

@rcAsironman rcAsironman left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@teamomiamigo All checks have failed. Please review your work and submit it again.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Improve Pin Clustering and Selection Behavior on ExploreScreen Map for Overlapping Notes
2 participants