Skip to main content

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:

  1. Uses custom glyphs from our Mapbox account: mapbox://fonts/justgetneo/\{fontstack\}/\{range\}.pbf
  2. Sets basemap config font = Pulp Display
  3. 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:

  1. Relying on Studio publish state
    Style loads, but app never sets:

    • lightPreset to day / dusk
    • font to your custom family
      So after publish, Studio defaults win. That can make daytime look like satellite / wrong theme, and night lose custom typography.
  2. 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:
    • lightPreset
    • font
    • 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:

  1. Loading one Studio style
  2. After style loads, writing Mapbox Standard import config:
    • daytime → lightPreset = day
    • evening → lightPreset = dusk
    • font → Pulp Display
  3. 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.