Full-Screen Map Development with Next.js and Mapbox

May 22, 2024 - Intermediate

$250.00 Fixed

Description:
We are seeking an experienced developer to create a full-screen map application using Next.js and Mapbox. The map should cover the entire screen and provide interactive features for users.

Project Requirements:

    Full-Screen Map:
        Develop a full-screen map using Next.js and Mapbox that covers the entire viewport.

    Interactive Clicks:
        Implement functionality so that when a user clicks on a point on the map, the application will fetch a GeoJSON dataset from the provided URL: GeoJSON Dataset.
        Display only the pins within a 1km radius of the clicked point.

    Radius Slider:
        Integrate a slider component allowing users to adjust the radius of the displayed pins dynamically.
        Ensure the slider can change the radius from the default 1km to the user-selected value.

    No External Material Libraries:
        Do not use any external material libraries. Instead, utilize Radix UI for further integration, as the previous developer used a headless UI.

    Responsiveness:
        Ensure the application is fully responsive and works seamlessly on both mobile and tablet devices.

Skills and Experience:

    Proficiency in Next.js and React.
    Experience with Mapbox and handling GeoJSON data.
    Familiarity with Radix UI or similar headless UI libraries.
    Strong understanding of responsive design principles.

Deliverables:

    A fully functional, full-screen map application as described.
    Source code with documentation on how to run and maintain the application.
    Responsive design that works on mobile and tablet devices.

If you have the necessary skills and experience, we would love to hear from you. Please apply with examples of similar projects you have completed.

  • Mexico
  • Proposal: 12
  • Verified
  • More than 3 month
AuthorImg
ManuelE Garcia Active
Jalisco , Mexico
Member since
May 22, 2024
Total Job
2