Personnalisez et mettez à jour l'expérience de feuille de route pour vos utilisateurs sans avoir à modifier le code de vos applications. Avec les styles de cartes basés dans le cloud de Google Maps Platform dans la console Google Cloud, vous pouvez sélectionner des couleurs et définir la visibilité des éléments du type de carte roadmap par défaut, puis les appliquer à toutes vos applications JavaScript, iOS et Android.
Bien que Google Maps propose différentes vues (satellite, relief et carte routière, par exemple), le style des cartes basées dans le cloud n'affecte que le type de carte roadmap par défaut.
Pour savoir comment personnaliser votre carte, consultez Personnaliser Maps.
Pourquoi utiliser les styles de cartes basés dans le cloud ?
Ils vous permettent de créer des cartes plus attrayantes et informatives, et de les mettre à jour sans modifier le code :
Plus d'éléments cartographiques : personnalisez près de 100 éléments cartographiques individuels, dans 4 catégories. Les points d'intérêt incluent des éléments comme "Divertissement", "Loisirs" et "Services", qui comprennent chacun plusieurs éléments enfants. Par exemple, l'élément "Services" inclut "Distributeur de billets", "Banque", "Station-service" et "Toilettes". Pour obtenir la liste complète, reportez-vous à Éléments auxquels vous pouvez appliquer un style sur la carte.
Plus d'options pour personnaliser une carte : les styles de cartes basés dans le cloud vous permettent de personnaliser votre carte plus facilement et de façon plus intuitive. Grâce aux mises à jour récentes, vous pouvez contrôler plus précisément l'apparence de la carte de base, avec des libellés et géométries qui n'étaient auparavant pas disponibles pour les éléments cartographiques. Par exemple, vous pouvez personnaliser les libellés appliqués aux sites touristiques, restaurants, espaces de loisirs, services d'urgence, commerces et plus encore.
Chargement rapide des cartes après la première utilisation : après le temps de démarrage initial, lorsqu'un style de carte est téléchargé et mis en cache, les affichages et les mouvements de panoramique/zoom ultérieurs sont plus rapides.
Amélioration de l'interface de l'éditeur de style de carte : les paramètres de la carte vous permettent de définir les propriétés du style de carte, comme les styles des bâtiments et points de repères, et les niveaux de densité des POI. Les éléments personnalisables s'affichent tous dans un même panneau, ce qui améliore la visibilité de la zone de carte lorsque vous effectuez des personnalisations. De plus, vous pouvez trouver plus facilement votre élément cartographique grâce à des catégories plus intuitives (que vous pouvez développer et réduire) et à une zone de filtrage permettant de limiter la liste à l'élément cartographique dont vous avez besoin.
À quoi servent les styles de cartes basés dans le cloud ?
Les styles de cartes basés dans le cloud vous permettent d'effectuer les opérations suivantes :
Utiliser un éditeur de style sans code : un graphiste peut créer et prévisualiser un style de sorte qu'il corresponde à vos objectifs et à votre branding sans devoir rédiger de code.
Modifier des styles sans avoir à modifier le code : une fois l'ID de carte en place, vous pouvez apporter et tester des changements de style de carte sans modifier votre code.
Personnaliser plus d'éléments cartographiques : les options de modification de la visibilité et des couleurs ont été étendues à de nouveaux éléments cartographiques tels que les routes, les bâtiments, les étendues d'eau, les points d'intérêt et les itinéraires de transports en commun.
Comment fonctionnent les styles de cartes basés dans le cloud ?
Les styles de carte sont stockés et peuvent être modifiés dans la console Cloud de Google Maps Platform. Votre application utilise un ID de carte pour demander un style de carte à la console Cloud, puis l'applique à votre application. Plusieurs ID de carte peuvent être associés à un même style afin que vos cartes puissent s'afficher de la même manière sur différentes plates-formes d'applications.
Comment utiliser les styles de cartes basés dans le cloud ?
Créez ou ouvrez un ID de carte pour votre type d'application, puis attribuez-lui un style de carte. Vous pouvez créer des ID de carte supplémentaires pour les applications exécutées sur d'autres plates-formes et leur attribuer le même style de carte. Pour en savoir plus, consultez Associer des ID de carte à votre style ou en supprimer.
Lorsque vous devez modifier le style de carte, faites-le à l'aide de la personnalisation dans le cloud. Pour en savoir plus, consultez Modifier un style de carte.
6
Publier le style de carte modifié
Lorsque vous êtes prêt à mettre à jour un style de carte, publiez-le. Votre nouveau style de carte s'affiche alors dans votre application. Pour en savoir plus, consultez Publier un style de carte.
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/12 (UTC).
[[["Facile à comprendre","easyToUnderstand","thumb-up"],["J'ai pu résoudre mon problème","solvedMyProblem","thumb-up"],["Autre","otherUp","thumb-up"]],[["Il n'y a pas l'information dont j'ai besoin","missingTheInformationINeed","thumb-down"],["Trop compliqué/Trop d'étapes","tooComplicatedTooManySteps","thumb-down"],["Obsolète","outOfDate","thumb-down"],["Problème de traduction","translationIssue","thumb-down"],["Mauvais exemple/Erreur de code","samplesCodeIssue","thumb-down"],["Autre","otherDown","thumb-down"]],["Dernière mise à jour le 2025/08/12 (UTC)."],[[["\u003cp\u003eCloud-based maps styling allows you to customize the appearance of the default roadmap in your Google Maps Platform applications (Android, iOS, JavaScript, and Web Service) through the Google Cloud Console.\u003c/p\u003e\n"],["\u003cp\u003eYou can create and update map styles without needing to change your application code, making it easier to maintain a consistent brand experience across platforms.\u003c/p\u003e\n"],["\u003cp\u003eCloud-based maps styling offers a vast range of customization options for nearly 100 map features, providing granular control over colors, visibility, and labels for elements like roads, buildings, points of interest, and more.\u003c/p\u003e\n"],["\u003cp\u003eMap styles are associated with map IDs, enabling you to apply the same style across different applications and platforms by using the corresponding map ID.\u003c/p\u003e\n"],["\u003cp\u003eOnce a map style is downloaded and cached, subsequent map loads and interactions are faster, providing a smoother user experience.\u003c/p\u003e\n"]]],["Cloud-based map styling in Google Maps Platform allows customization of the default `roadmap` view for Android, iOS, and JavaScript applications. Key actions include creating map styles via a no-code editor, associating them with map IDs, and implementing these IDs into applications. This enables style changes without code updates. Users can customize nearly 100 features, including points of interest, labels, and geometries. The process involves getting started, creating styles, linking them to map IDs, and adding the ID to apps. Subsequent map views are quicker after the first load.\n"],null,["Select platform: [Android](/maps/documentation/android-sdk/cloud-customization \"View this page for the Android platform docs.\") [iOS](/maps/documentation/ios-sdk/cloud-customization \"View this page for the iOS platform docs.\") [JavaScript](/maps/documentation/javascript/cloud-customization \"View this page for the JavaScript platform docs.\") [Web Service](/maps/documentation/maps-static/cloud-customization \"View this page for the Web Service platform docs.\")\n\n\u003cbr /\u003e\n\n| **Paid feature:**\n| Features accessed by adding a [map ID](/maps/documentation/get-map-id) triggers a map\n| load charged against the Dynamic Maps SKU for Android and iOS. See\n| [Google Maps Billing](/maps/billing-and-pricing/sku-details#dynamic-maps-ess-sku) for more information.\n\nCustomize and update the road map experience for your users without\nhaving to update your apps' code. With the Google Maps Platform cloud-based maps styling in the Google Cloud Console, you can select colors and set visibility for features on the default `roadmap` map type and apply it to all of your JavaScript, iOS, and Android applications.\n\nWhile Google Maps provides different views, such as satellite, terrain, and road map, cloud-based maps styling affects only the default `roadmap` map type.\n\nFor information on other ways to customize your map, see [Customize Maps](../map-ids/customize-maps-overview.md).\n\nWhy use cloud-based maps styling\n\nWith cloud-based maps styling, you can create more engaging and informative maps\nand update them without code changes:\n\n- **More map features** : Customize almost 100 individual map features, in four categories. Points of interest includes features such as Entertainment, Recreation, and Services, which each also have several child features. For example, Services includes ATM, Bank, Gas station, and Restroom. For the full list, see [What you can style on a map](/maps/documentation/javascript/cloud-customization/taxonomy).\n- **More ways to customize maps**: Cloud-based maps styling makes it easier and more intuitive for you to style your map. Recent updates give you more granular control over the look and feel of the basemap with labels and geometries not previously available for map features. For example, you can customize labels applied to tourist attractions, restaurants, recreational areas, emergency services, retail, and more.\n- **Maps load quickly after the first use**: After the initial startup time as a map style is downloaded and cached, subsequent views and pan/zoom movement of the map are faster.\n- **Improved map style editor interface**: Map settings let you define map style properties, such as Building and landmark styles and POI density levels. Styleable elements are all shown on a single panel, giving you more visible map area when making customizations. It is also easier to find your map feature with more intuitive categories that expand and collapse, plus a filter box to scope the list to the map feature you need.\n\nWhat can you do with cloud-based maps styling\n\nYou can do the following with cloud-based maps styling:\n\n- **Use a no-code style editor**: A designer can create and preview a style to match your goals and branding without needing to code.\n- **Change styles without code changes**: Draft and test map style changes without any changes to your code once the map ID is in place.\n- **Style more map features**: Change the visibility and color of more map features, such as roads, buildings, bodies of water, points of interest, and transit routes.\n\nHow cloud-based maps styling works\n\nMap styles are stored and edited in the Google Maps Platform Cloud Console. Your\napplication uses a map ID to request a map style from the cloud console, and then\napplies it to your application. You can have several map IDs associated with the same map style,\nso your maps can look the same across your application platforms. \n\nHow to use cloud-based maps styling\n\n|---|--------------------------------------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| 1 | **Get started** | Head over to [Get started and set up](/maps/documentation/javascript/cloud-customization/setup-leg), and then check out the [Tutorial](/maps/documentation/javascript/cloud-customization/tut-leg). |\n| 2 | **Create a cloud-based map style** | See [Create and use map styles](/maps/documentation/javascript/cloud-customization/map-styles-leg). |\n| 3 | **Associate your map style with a map ID** | Create or open a map ID for your application type, and assign a map style to it. You can create additional map IDs for applications on other platforms and assign the same map style to them. For details, see [Associate or remove map IDs on your style](/maps/documentation/javascript/cloud-customization/map-styles-leg#associate-style-with-map-id). |\n| 4 | **Add the map ID to your application** | Your maps then use the map style associated with that map ID. For details, see [Add the map ID to your map](/maps/documentation/get-map-id#add-a-map-id-to-your-app). |\n| 5 | **Adjust your map style online** | Whenever you need to change your map style, edit it in cloud styling. For details, see [Update a map style](/maps/documentation/javascript/cloud-customization/map-styles-leg#update-style). |\n| 6 | **Publish your changed map style** | When you're ready to update a map style, publish it, and your new map style shows up in your application. For details, see [Publish a map style](/maps/documentation/javascript/cloud-customization/map-styles-leg#publish-style). |\n\nWhat's next\n\n- Try out the [Tutorial](/maps/documentation/javascript/cloud-customization/tut-leg).\n- Check out cloud styling application requirements. See [Application requirements](/maps/documentation/javascript/cloud-customization/setup-leg#reqs)."]]
