AI-generated Key Takeaways

outlined_flag

• A map style is a customizable set of visual elements applied to a map using a map ID, which is referenced in your application code.

• You can create a map style by starting fresh, duplicating an existing style/version, or importing JSON styling code.

• Map styles exist as either draft or published versions, with published versions actively displayed on maps using the associated map ID.

• Once a map style is created, you can further customize its appearance, manage version history, associate it with map IDs, and perform other actions like renaming, duplicating, or deleting it.

• Styles can be associated with multiple map IDs for use across various Google Maps applications, but each map ID can only be linked to one style at a time.

Features in this document marked with thescience science icon are inPreview (Pre-GA).

A map style is a set of visual customizations to map featuresthat you associate with a map ID. You then reference themap ID in your application code to display the customized map.

You can create a map style before you have a map ID; however, to usethe style, you must associate the style with a map ID. To use a map style,you must take all of these steps:

1. Create and publish a map Style. For details, seeCreate a style andPublish a style.

2. Create a map ID. For details, seeCreate a map ID.

3. Associate the map style with a map ID. For details, seeAssociate a map ID to a map style.

4. Add the map ID to your app to display your style. For details, seeAdd the map ID to your map.

Tip: Once the map ID is in yourapplication code, you can change the map style without anychanges in your application code, and your end users don't have toupgrade to see updated map styles.Instead, you edit the map style associated with themap ID, and changes show up in your application maps.

This document describes how to create, edit, and publish map styles and how toassociate them to a map ID.

Create a map style

Create a map style using one of these methods:

• Create a new style using the default Google map style.

• Copy and modify an existing customized style.

• Import a JSON map style to use as a customized style.

Create a new style

1. In the Google Cloud console,go toMap Styles, and select a project, if needed.

2. InMap styles, clickCreate style.

3. In the dialog, under theGoogle styles tab, select a mode.

   • Light creates a light themed style, ideal for bright or outdoor environments.
   • scienceDark creates a dark themed style, ideal for low light environments.

   For more information about light and dark mode styles, seeLearn about modes and map types.

4. (Optional) To apply the monochrome variation to your map style, selectMonochrome.

   Alternatively, you can click theJSON tab toimport a JSON map style.

   

5. SelectCustomize to create a new untitled style.

6. Select map features and change their style to create the map style you want.

   Map features with custom styles have a solid blue dot next to them. If youcustomize a child style, the parent style displays a blue circle. For moreinformation on map style hierarchy, seeUnderstand map style inheritance and hierarchy.

   Note: Not all styles appear at all zoom levels. For more information, seeStyle zoom levels.

7. ClickSave.

8. In theSave and publish map style box, enter a name for your style andoptionally a description, and clickSave.

The style is automatically published, and you see the style details page foryour new style.

Caution: Making style changes but not explicitly saving them createsUnsaved Changes in your map style's version history. These versionsare lost when you close the browser tab or when yourCloud console session ends.

Copy a style

1. Go toMap Styles, and select a project, if needed.

2. Select one of your existing styles.

3. On the style page, clickMake a copy.

4. In theMake a copy dialog, enter a new map style name and optionallya description.

5. science (Optional) To create the complementary light or dark modeversion of the copied style, select the checkbox in theStyle modeoptions section.

6. ClickSave.

   The style is automatically published, and you can see your new style'smain page. Associate it with a map ID to use it for your maps. For details,seeAssociate a map ID to a map style.

7. If you want to modify the style, clickCustomize, make changes,and clickSave.

Publish a style

When you first create a new map style, that first instance ofthe new map style is automatically published. After that, you save changesas a draft and when you're happy with the changes, you must publish.

1. Make the changes to the map style or duplicated map style. For details, seeChange a style.

2. ClickSave to save changes as a draft.

3. When you're ready to publish and have your changes go live for any map IDsusing that map style, clickPublish.

Published versus Draft map styles

Published: A published map style is live. Any maps that use the map styledisplay the published version of it.

Note: Style changes can take a few hours to propagate to your apps websites, and apps can take longer if the devices aren't connected to the internet. If you're still not seeing your style changes after a few hours, seeMy style changes aren't updating.

Draft: Draft versions of a map style are works in progressand aren't displayed in maps until you publish them.

Change a style

If you want to make changes to your map style, you can make the changes rightin the style editor. You have a couple of choices when you update a style:

• If you want changes to go live as soon as you're ready: ClickCustomize and make your changes. ClickSave to save yourchanges as a draft, and then clickPublish when you are ready.

• If you want to test your changes in a test environment first: Instead ofmaking changes directly in the map style, duplicate the style first. Fordetails, seeCopy a style andTest map style updates.

Once you've created a map style, you can make changes to it on the style'sdetail page in any of the following ways:

• Edit: ClickCustomize.

• Make a copy: For details, seeCopy a style.

• Rename: Rename the map style.

• Delete: Delete the map style.

Use data-driven styling and datasets

In the style details page, you can enable and view layers fordata-driven styling for boundaries anddata-driven styling for datasets on light mode styles.

When you link a light mode style that has data-driven styling or datasets enabledto amap ID, the enabled layers are also available forthescience dark mode style.

To use data-driven styling or datasets with ascience dark mode style,you must do the following in the Google Cloud console:

1. Go toMap Styles and either select a light mode style orcreate one.

2. In the style details page, enable your choice of layers on the light modestyle.

3. Associate the light mode style to the same mapID as the dark mode style.

Associate your style to a map ID

Associate your style to a map ID to display your custom style on your websiteand in your app. A map ID can have only one light mode style and onescience dark mode style associated with it.

To change the associated styles for a map ID, do the following in theGoogle Cloud console:

1. Go toMap Management and select a map ID.

2. In theMap styles section, clickeditEdit for light orsciencedark mode.

3. In the panel, select a style to associate to this map ID.

   Note: The panel displays only styles with a light style type for light mode, andonly styles with ascience dark style type for dark mode.

4. ClickDone.

5. science (Optional) Apply your style to different map types.

   By default, your style is applied to all the available map types (roadmap,terrain,hybrid,navigation). To apply your style to specific maptypes, clickexpand_moreShow more andselect the checkbox for each map type listed for both light and dark modes.To apply the default Google map style for that mode instead, clear thecheckbox for a map type.

   For moreinformation about map types, seeLearn about modes and maptypes.

6. ClickSave to apply all changes.

To use your cloud-based map style,add the map ID to your app.