Skip to content

Conversation

@jussi-sa
Copy link
Contributor

@jussi-sa jussi-sa commented Sep 4, 2025

Description

Introduces a new interactive tool that guides users through creating custom Mapbox styles step-by-step.

How It Works

The tool follows a 4-step wizard flow:

  1. Name Selection - User provides a name for their custom style
  2. Feature Configuration - User chooses which map elements to display:
    • Place labels, road labels, POI labels
    • Buildings, parks, transit features
  3. Color Palette - User defines colors for:
    • Roads, water, land, labels
    • Buildings and parks (optional)
  4. Style Generation - Produces complete Mapbox style JSON with user's configuration

Key Features

  • Step-by-step guided workflow prevents skipping ahead
  • Generates Mapbox GL JS compatible style specifications
  • Supports both hex colors and named colors
  • Configurable visibility for all major map features
  • Creates styles with proper layer ordering and zoom-based styling

Output

Generates a complete Mapbox style JSON that includes:

  • Vector tile sources from Mapbox Streets and Terrain
  • Properly configured layers for all selected features
  • User-defined color scheme
  • Appropriate fonts and sprites

Testing

image image image

Checklist

  • Code has been tested locally
  • Unit tests have been added or updated
  • Documentation has been updated if needed

Additional Notes

@jussi-sa jussi-sa requested a review from a team as a code owner September 4, 2025 11:02
Copy link
Member

@zmofei zmofei left a comment

Choose a reason for hiding this comment

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

Let some comments.

I think in the current case, we are too detailed, we can't possibly list all the layers and categories, I suggest it's better to let the LLM know how to set up the layers, how to configure the colors and other general information through this TOOL.

Please refer to streets v8 tileset specification https://docs.mapbox.com/data/tilesets/reference/mapbox-streets-v8/#landuse for all the details layers and properties.

Also, we could think about the standard style(not only the classical style) as well.


export const StyleHelperToolSchema = z.object({
step: z
.enum(['start', 'features', 'colors', 'generate'])
Copy link
Member

Choose a reason for hiding this comment

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

Is there an introduction about how and when to use those steps? Can LLM understand this?

Comment on lines +10 to +15
show_pois: z.boolean().optional().describe('Show POI labels'),
show_road_labels: z.boolean().optional().describe('Show road labels'),
show_place_labels: z.boolean().optional().describe('Show city/town labels'),
show_transit: z.boolean().optional().describe('Show transit features'),
show_buildings: z.boolean().optional().describe('Show buildings'),
show_parks: z.boolean().optional().describe('Show parks and green spaces'),
Copy link
Member

Choose a reason for hiding this comment

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

We seems trying to list the layers, but can we exhaust all the layers?
For example: in streets v8 tileset we have airport_label , landuse_overlay, natural_label etc. are this listed here? Maybe it's better to "teach" LLM how to do the general configure and provide the resources(i.e. all the layers from streets v8), so that agent can do the job by themself, not relay on we list the possible features layers here.

Comment on lines +17 to +22
road_color: z.string().optional().describe('Road color (hex)'),
water_color: z.string().optional().describe('Water color (hex)'),
building_color: z.string().optional().describe('Building color (hex)'),
land_color: z.string().optional().describe('Land/background color (hex)'),
park_color: z.string().optional().describe('Park color (hex)'),
label_color: z.string().optional().describe('Label text color (hex)')
Copy link
Member

Choose a reason for hiding this comment

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

The same here, the source layer could be a lot, how could we involved all related layers?
For example:

  • In the water_color we only control the water layer, but how about the waterway layer?
    The
  • In the land_color we control all the features from landuse layer, but how about landuse_overlay layer? And if we listed the park_color, how about airport_color, grass_color, sand_color etc.?

@jussi-sa jussi-sa merged commit 8fd7aa2 into main Sep 5, 2025
1 check passed
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.

2 participants