mapbox / mapbox/mapbox-gl-js

Allow controls to be placed at top-center, bottom-center, left-center, and right-center

Open
#3,039 12 comments 16 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

feature :green_apple: good first issue
Dominant language
TypeScript
Stars
12.4k
Forks
2.4k
PR merge metrics
No merged PRs in 30d

Description

**mapbox-gl-js version**:Master
### Steps to Trigger Behavior

Can you please suggest a workaround / solution for this? This is blocking switching from G Maps to Mapbox GL JS.

We need to put controls on the map at **top center** and **bottom center**. Google maps supports this and other positions for controls. You can find more details of supported positions at the link below. TOP_CENTER and BOTTOM_CENTER would unblock me.

I am hoping it just a matter of adding css. mapbox-gl.css only includes css for adding controls at the four corners.

https://developers.google.com/maps/documentation/javascript/controls
### Expected Behavior
### Actual Behavior

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by inspecting the control-position rules in mapbox-gl.css and how the existing corner positions are represented. Confirm the supported placement names and add the requested top-center and bottom-center positions, along with left-center and right-center if they are in scope. Done means controls can be placed at each requested position without affecting the existing corner placements.

Written by the indexing model from the issue text.

Assessment

Tech stack
css, typescript
Domain
frontend
Issue type
Feature
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.