Accédez à la console Google Cloud, puis sélectionnez Styles de carte. Sélectionnez un projet ou créez-le si nécessaire.
Sélectionnez Créer un style.
En bas de la boîte de dialogue, sélectionnez Personnaliser.
Appliquer un style au réseau routier
Sous Éléments cartographiques, développez Infrastructure, puis sélectionnez Réseau routier.
Dans le panneau qui s'affiche à droite, sous Polyligne, accédez à Couleur de remplissage, puis sélectionnez la case colorée.
Choisissez une couleur vive. Si vous modifiez la couleur, la case Couleur de remplissage est automatiquement cochée.
Sous Épaisseur du trait, définissez l'épaisseur sur 5 px.
Sur la carte, faites un zoom avant et arrière pour constater l'effet de vos modifications. Comme vous avez sélectionné un élément cartographique relativement haut dans la hiérarchie, tous les types de routes situés en dessous ont hérité des modifications.
Enregistrer et publier votre style de carte
En haut à droite, sélectionnez Enregistrer.
Dans Enregistrer et publier le style de carte, saisissez le nom de votre style de carte et une description (facultative).
Sélectionnez Enregistrer. Votre style de carte est enregistré et publié.
Étape 2 : Créez et associez un ID de carte
Un ID de carte vous permet d'utiliser votre style de carte dans des applications et sur des sites Web. Si vous apportez des modifications au style de carte associé à un ID de carte, ces changements s'appliquent lorsque vous publiez le style. Aucune mise à jour de logiciel ni d'application n'est donc nécessaire.
Créer un ID de carte
Dans la console Google Cloud, sélectionnez Gestion des cartes.
En haut de l'écran, sélectionnez Créer un ID de carte.
Saisissez le nom de votre ID de carte et une description (facultative).
Sélectionnez le type de carte correspondant à l'ID de carte selon l'endroit où vous souhaitez utiliser votre style de carte.
En bas de la page, sélectionnez Enregistrer. Votre ID de carte a été créé.
Associer l'ID de carte à votre style de carte
Sous Style de carte, sélectionnez Modifier le style à côté de Clair.
Sous Modifier le style clair, choisissez le style de carte à utiliser pour le mode clair dans vos applications, puis sélectionnez OK.
Répétez l'opération en sélectionnant Modifier le style à côté de Sombre, puis sélectionnez un style de carte en mode sombre.
Sélectionnez Enregistrer. Votre ID de carte est maintenant associé à vos styles de carte.
Étape 3 : Ajoutez l'ID de carte à vos applications ou sites Web
Maintenant que votre ID de carte est associé à un style de carte publié, vous pouvez l'ajouter à vos applications ou sites Web et le tester pour vous assurer qu'il fonctionne comme prévu.
Voici quelques actions possibles à effectuer ensuite :
Mettre à jour un style : modifiez votre style de carte et publiez-le, puis observez les changements s'afficher automatiquement dans vos applications et sur vos sites Web. Si vous souhaitez tester vos modifications avant de les publier, consultez Tester les mises à jour du style de carte.
Utiliser la hiérarchie des éléments cartographiques pour obtenir efficacement les styles qui vous intéressent :
par exemple, si vous personnalisez l'élément cartographique de niveau supérieur Élément naturel > Couverture terrestre, tous les éléments inférieurs liés au sol hériteront de son style. Vous pourrez ensuite personnaliser individuellement les éléments enfants auxquels vous souhaitez appliquer un autre style.
Sauf indication contraire, le contenu de cette page est régi par une licence Creative Commons Attribution 4.0, et les échantillons de code sont régis par une licence Apache 2.0. Pour en savoir plus, consultez les Règles du site Google Developers. Java est une marque déposée d'Oracle et/ou de ses sociétés affiliées.
Dernière mise à jour le 2025/08/31 (UTC).
[null,null,["Dernière mise à jour le 2025/08/31 (UTC)."],[],[],null,["# Tutorial - Highlight a road network\n\nSelect platform: [Android](/maps/documentation/android-sdk/cloud-customization/tut \"View this page for the Android platform docs.\") [iOS](/maps/documentation/ios-sdk/cloud-customization/tut \"View this page for the iOS platform docs.\") [JavaScript](/maps/documentation/javascript/cloud-customization/tut \"View this page for the JavaScript platform docs.\") [Web Service](/maps/documentation/maps-static/cloud-customization/tut \"View this page for the Web Service platform docs.\")\n\n\u003cbr /\u003e\n\n| To use cloud-based maps styling on Android, you must use the latest renderer for Maps SDK for Android. [Follow these instructions](/maps/documentation/android-sdk/renderer).\n\nThis tutorial walks you through the steps to create and use a map style that\nhighlights the road network:\n\n1. **[Create and publish a map style](#tut1)** so it's available to use.\n\n2. **[Create and connect a map ID](#tut2)** that lets you use your style in\n apps and websites.\n\n3. **[Add the map ID to your apps and websites](#tut3)** so your apps use\n your map style.\n\nStep 1: Create and publish a map style\n--------------------------------------\n\n### Open cloud-based maps styling\n\n1. Go to the Google Cloud console, and select [**Map Styles**](https://console.cloud.google.com/project/_/google/maps-apis/studio/styles). Select or create a project, if needed.\n\n2. Select **Create Style**.\n\n3. At the bottom of the dialog, select **Customize**.\n\n### Style the Road network\n\n1. Under **Map Features** , expand **Infrastructure** , then select **Road\n network**.\n\n2. On the panel that pops up on the right, under **Polyline** ,\n then **Fill color**, select the color box.\n\n3. Choose a bright color. Changing the color automatically checks\n the **Fill color** box.\n\n | **Note:** A solid dot appears next to the map feature to indicate it has a custom style.\n4. Under **Stroke width**, set the stroke width to 5px.\n\n5. On the map, zoom in and out to see the effect of your changes. Because\n you selected a map feature that is relatively high in the hierarchy,\n all road types underneath it have inherited your changes.\n\n### Save and publish your map style\n\n1. At the top right, select **Save**.\n\n2. In **Save and publish map style**, enter a name and, optionally, a\n description for your map style.\n\n3. Select **Save**. Your map style is saved and published.\n\n| **Note:** The first time you save a map style, it is published automatically since it's the first version. When you subsequently update a map style, you can save changes as drafts as you go, and then publish when you're finished and want the style updated.\n\nStep 2: Create and connect a map ID\n-----------------------------------\n\nA map ID lets you use your map style on apps and websites. If you make changes\nto the map style associated with a map ID, your style changes\ngo live when you publish, so no software or app updates are needed.\n\n### Create a map ID\n\n1. In the Google Cloud console, select **Map Management**.\n\n2. At the top, select **Create map ID**.\n\n3. Add a name for your map ID, and optionally, a description.\n\n4. Select the map type for the map ID, depending on where you want to use your\n map style.\n\n | **Note:** If you want to use your map style for different types of applications or websites, create a new map ID for each type, and then connect them all to the same map style.\n5. At the bottom of the page, select **Save**. Your map ID is created.\n\n### Connect the map ID to your map style\n\n1. Under **Map style** , select **Change style** next to **Light**.\n\n2. Under **Change light style** , choose what map style to\n use for light mode in your apps, and select **Done**.\n\n3. Repeat by selecting **Change Style** next to **Dark** and select a dark\n mode map style.\n\n | **Note:** If you don't select a dark style, or have not created any dark mode map styles, you can select the Google default dark map style.\n4. Select **Save**. Your map ID is now associated with your map styles.\n\nStep 3: Add the map ID to your apps or websites\n-----------------------------------------------\n\nNow that you have a map ID that is associated with a published map style,\nyou can add it to your apps or websites and test to make sure it functions\nas expected.\n\nFor more information about adding a map ID, see\n[Add the map ID to your map](/maps/documentation/get-map-id#add-a-map-id-to-your-app).\n\nWhat's next\n-----------\n\nHere are some things you can try next:\n\n- **Update a style** . Make changes to your map style and publish it,\n and see the changes show up automatically in your apps and websites. If you\n want to test your changes before they go live, see\n [Test map style updates](/maps/documentation/android-sdk/cloud-customization/test-style-updates).\n\n- **Use the map feature hierarchy to efficiently get the styles you want** .\n For example, you can style the high-level map feature **Natural\\\u003eLand**,\n and all of the land map features under it inherit the styling. You can\n then do custom styling on just the child map features that you want to\n be different."]]
