How to fix the map
How to fix the map
Short answer: this is mostly a mobile-app config issue, not something you fix only by clicking around in Mapbox Studio. Publishing can change Studio defaults, but this prototype works because the app re-applies the correct basemap settings every time.
How this prototype does it
We do not swap between a “day style” and a “night style”, and we do not switch to satellite for daytime.
1. One style shell
All maps use the same Studio style URI:
const mapboxStyleUri =
'mapbox://styles/justgetneo/cmq2w69v6000r01pi8t3yc30g';
That style is Mapbox Standard–based.
2. Day / night = lightPreset, set in app code
In map_pin_service.dart:
- daytime / all →
'day' - evening →
'dusk'
Then MapboxStyleService.applyBasemapStyle(...) applies:
config: {
'font': 'Pulp Display',
'lightPreset': lightPreset, // 'day' or 'dusk'
}
So daytime becoming satellite usually means production is setting the wrong basemap theme/preset, or relying on Studio defaults after publish. In this app, daytime is explicitly forced to day.
3. Custom formatting is also forced in-app
Night missing your formatting is usually the font setup.
This app does three things:
- Uses custom glyphs from our Mapbox account:
mapbox://fonts/justgetneo/\{fontstack\}/\{range\}.pbf - Sets basemap config
font=Pulp Display - Optionally replaces the Standard basemap import with a local patched JSON:
assets/map/standard_basemap_patched.json
That is why evening/day stay consistent even if Studio publish changes.
Where production is likely going wrong
Two common mistakes:
-
Relying on Studio publish state
Style loads, but app never sets:lightPresettoday/duskfontto your custom family
So after publish, Studio defaults win. That can make daytime look like satellite / wrong theme, and night lose custom typography.
-
Thinking day/night = different styles
Correct approach here is one Standard style + runtime config:lightPreset: "day"lightPreset: "dusk"
Not:
- day style / night style
- satellite for day
Do we fix it on Mapbox side or app side?
Both matter, but the reliable fix is app side.
- Mapbox side: make sure style is Standard-based, custom font uploaded, and Studio defaults are sane.
- App side (required): after style load, always set:
lightPresetfont- glyph URL to your account fonts
Publishing can change Studio defaults; that matches what they saw. This prototype survives publish because runtime config overrides those defaults.
What to tell the devs
Tell them this prototype works by:
- Loading one Studio style
- After style loads, writing Mapbox Standard import config:
- daytime →
lightPreset = day - evening →
lightPreset = dusk - font →
Pulp Display
- daytime →
- Pointing glyphs at the account that owns that font
If their production map doesn’t do those runtime writes, publish will keep breaking it.
If you want, I can also draft a short Slack-style message for them with the exact properties to set.