Цветовая схема карты
Оптимизируйте свои подборки
Сохраняйте и классифицируйте контент в соответствии со своими настройками.
Для карт типа roadmap и terrain цветовую схему (тёмную, светлую или текущую системную) можно задать с помощью параметра google.maps.colorScheme . Параметр colorScheme можно задать только при инициализации карты; установка этого параметра после создания карты не даст никакого эффекта.
Дорожная карта
На следующем изображении показаны цветовые схемы светлого и темного режима для типа roadmap .
Местность
На следующем изображении показаны цветовые схемы светлого и темного режима для данного типа terrain .
По умолчанию карта использует светлый режим. При создании карты импортируйте ColorScheme и укажите цветовую схему карты ( LIGHT , DARK или FOLLOW_SYSTEM ) в параметрах карты, как показано здесь.
const {ColorScheme} = await google.maps.importLibrary("core")
const mapOptions = {
center: { lat: -34.397, lng: 150.644 },
zoom: 8,
colorScheme: ColorScheme.DARK,
}
map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
Если сбросить параметры после создания карты, colorScheme не окажет никакого эффекта.
Чтобы создать индивидуальные светлые и темные стили для ваших типов карт, используйте облачные стили оформления карт .
Если не указано иное, контент на этой странице предоставляется по лицензии Creative Commons "С указанием авторства 4.0", а примеры кода – по лицензии Apache 2.0. Подробнее об этом написано в правилах сайта. Java – это зарегистрированный товарный знак корпорации Oracle и ее аффилированных лиц.
Последнее обновление: 2025-08-27 UTC.
[null,null,["Последнее обновление: 2025-08-27 UTC."],[[["\u003cp\u003eRoadmap and terrain map types allow customization of color schemes (light, dark, or system default) using \u003ccode\u003egoogle.maps.colorScheme\u003c/code\u003e.\u003c/p\u003e\n"],["\u003cp\u003eThe \u003ccode\u003ecolorScheme\u003c/code\u003e option must be set during map initialization and cannot be changed afterward.\u003c/p\u003e\n"],["\u003cp\u003eBy default, maps use light mode; to change, import \u003ccode\u003eColorScheme\u003c/code\u003e and specify the desired scheme (LIGHT, DARK, or FOLLOW_SYSTEM) within map options.\u003c/p\u003e\n"],["\u003cp\u003eCustom styles using Map IDs are only compatible with the light color scheme for roadmap map types.\u003c/p\u003e\n"]]],[],null,["# Map color scheme\n\nFor maps of type `roadmap` and `terrain`, you can set the map color scheme\n(dark, light, or current system setting) by using `google.maps.colorScheme`. The\n`colorScheme` option can only be set when the map is initialized; setting this\noption after the map is created will have no effect. \n\n### Roadmap\n\nThe following image shows the light mode and dark mode color schemes for the\n`roadmap` type.\n\n### Terrain\n\nThe following image shows the light mode and dark mode color schemes for the\n`terrain` type.\n\nBy default, the map uses light mode. When creating the map, import `ColorScheme`\nand specify the map color scheme (`LIGHT`, `DARK`, or `FOLLOW_SYSTEM`) in\nmap options, as shown here. \n\n const {ColorScheme} = await google.maps.importLibrary(\"core\")\n\n const mapOptions = {\n center: { lat: -34.397, lng: 150.644 },\n zoom: 8,\n colorScheme: ColorScheme.DARK,\n }\n map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);\n\nIf you reset the options after the map is instantiated, `colorScheme` has no\neffect.\n\nTo create custom light styles and dark styles for your roadmap map types, use\n[cloud-based maps styling](/maps/documentation/javascript/cloud-customization)."]]
