الألوان على الخريطة
تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
بالنسبة إلى الخرائط من النوع 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 Attribution 4.0 ما لم يُنصّ على خلاف ذلك، ونماذج الرموز مرخّصة بموجب ترخيص Apache 2.0. للاطّلاع على التفاصيل، يُرجى مراجعة سياسات موقع Google Developers. إنّ Java هي علامة تجارية مسجَّلة لشركة Oracle و/أو شركائها التابعين.
تاريخ التعديل الأخير: 2025-08-27 (حسب التوقيت العالمي المتفَّق عليه)
[null,null,["تاريخ التعديل الأخير: 2025-08-27 (حسب التوقيت العالمي المتفَّق عليه)"],[[["\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)."]]