خرائط ذات نمط

ويمكنك تخصيص عرض خريطة Google العادية من خلال تطبيق أنماطك الخاصة عند استخدام Maps Static API. يمكنك تغيير طريقة العرض المرئي للميزات، مثل الطرق والمتنزهات والمناطق السكنية وغيرها من نقاط الاهتمام. يمكنك تغيير لونها أو نمطها لإبراز محتوى معيّن أو تكامل المحتوى المحيط به على الصفحة أو حتى إخفاء الميزات تمامًا.

أمثلة

يعرض المثال التالي خريطة لمدينة بروكلين في الولايات المتحدة بتنسيق لونها للطرق المحلية باللون الأخضر الزاهي والمناطق السكنية باللون الأسود. ويعكس أيضًا سطوع التصنيفات كي تبرز بشكل أفضل على خلفية داكنة. لاحظ أنّ هذا المثال العملي يستخدم ترميز عناوين URL:

https://maps.googleapis.com/maps/api/staticmap?size=512x512&zoom=15&center=Brooklyn&style=feature:road.local%7Celement:geometry%7Ccolor:0x00ff00&style=feature:landscape%7Celement:geometry.fill%7Ccolor:0x000000&style=element:labels%7Cinvert_lightness:true&style=feature:road.arterial%7Celement:labels%7Cinvert_lightness:false&key=YOUR_API_KEY&signature=YOUR_SIGNATURE
خريطة نمطية لبروكلين.

يستخدم المثال التالي عمليات التصميم والتبسيط لتقريب مظهر أطلس الطرق في الولايات المتحدة:

https://maps.googleapis.com/maps/api/staticmap?size=512x512&zoom=12&center=Chicago&format=png&style=feature:road.highway%7Celement:geometry%7Cvisibility:simplified%7Ccolor:0xc280e9&style=feature:transit.line%7Cvisibility:simplified%7Ccolor:0xbababa&style=feature:road.highway%7Celement:labels.text.stroke%7Cvisibility:on%7Ccolor:0xb06eba&style=feature:road.highway%7Celement:labels.text.fill%7Cvisibility:on%7Ccolor:0xffffff&key=YOUR_API_KEY&signature=DITIGAL_SIGNATURE
نمط خريطة أطلس الطرق في الولايات المتحدة.

بنية النمط

لإنشاء خريطة مخصّصة ذات نمط، يمكنك تضمين مَعلمة style واحدة أو أكثر في عنوان URL للطلب.

قد يحتوي كل تعريف style على الوسيطات التالية، مفصولة بالشرطة الرأسية ("|"):

  • تشير السمة feature (اختيارية) إلى الميزات التي يجب اختيارها لتعديل هذا النمط. تتضمن الميزات عناصر على الخريطة، مثل الطرق أو المتنزهات أو نقاط الاهتمام الأخرى. إذا لم تتوفر الوسيطة feature، سيتم تطبيق النمط المحدّد على جميع الميزات.
  • تشير السمة element (اختيارية) إلى عناصر الميزة المحددة التي يجب اختيارها لتعديل هذا النمط. العناصر هي خصائص الميزة، مثل الهندسة أو التصنيفات. وإذا لم تتوفر الوسيطة element، سيتم تطبيق النمط على جميع عناصر الميزة المحددة.
  • مجموعة من قواعد النمط (الإلزامية) التي يتم تطبيقها على العناصر والعناصر المحددة. تطبّق واجهة برمجة التطبيقات القواعد بالترتيب الذي تظهر به في بيان style. يمكنك تضمين أي عدد من القواعد ضمن قيود طول عنوان URL العادية في Maps Static API.
style=feature:myFeatureArgument|element:myElementArgument|myRule1:myRule1Argument|myRule2:myRule2Argument

الميزات

يلّون إعلان style التالي جميع الطرق على الخريطة:

style=feature:road|color:0xffffff

وفي ما يلي بعض الاختيارات الشائعة للميزات:

  • ويختار feature:all (الإعداد التلقائي) جميع عناصر الخريطة.
  • يختار feature:road جميع الطرق على الخريطة.
  • يختار feature:road.local كل الطرق المحلية.

الميزات أو أنواع الميزات هي خصائص جغرافية على الخريطة، بما في ذلك الطرق والمنتزهات والمسطحات المائية والأنشطة التجارية وغيرها.

تشكِّل الميزات شجرة فئات، مع تحديد all على أنّها الجذر. إذا لم تحدد ميزة، يتم تحديد جميع الميزات. يؤدي تحديد ميزة all إلى التأثير نفسه.

تحتوي بعض الميزات على ميزات ثانوية تحدّدها باستخدام علامة النقطة. على سبيل المثال، landscape.natural أو road.local. أما إذا حددت الميزة الرئيسية فقط، مثل road، فسيتم تطبيق الأنماط التي يتم تحديدها للعنصر الرئيسي على جميع عناصرها الثانوية، مثل road.local وroad.highway.

يُرجى العِلم بأنّ الميزات الرئيسية قد تتضمّن بعض العناصر التي لم يتم تضمينها في كل الميزات الفرعية.

تتوفّر الميزات التالية:

  • تختار all (الخيار التلقائي) كل الميزات.
  • يختار administrative جميع المناطق الإدارية. ويؤثر التنسيق في تصنيفات المناطق الإدارية فقط، وليس على الحدود الجغرافية أو التعبئة.
    • تختار administrative.country البلدان.
    • يختار تطبيق "administrative.land_parcel" قطع الأراضي.
    • يحدد administrative.locality المناطق المحلية.
    • يتم اختيار الأحياء من قِبل "administrative.neighborhood".
    • يتمّ اختيار المقاطعات من خلال administrative.province.
  • يختار landscape جميع المناظر الطبيعية.
    • يختار landscape.man_made العناصر من صنع الإنسان، مثل المباني والبنى الأخرى.
    • يختار تطبيق landscape.natural الميزات الطبيعية، مثل الجبال والأنهار والصحاري والأنهار الجليدية.
    • يختار landscape.natural.landcover ميزات الغطاء الأرضي، والمواد المادية التي تغطي سطح الأرض، مثل الغابات والأراضي العشبية والأراضي الرطبة والأراضي العارية.
    • يختار landscape.natural.terrain ميزات التضاريس لسطح الأرض، مثل الارتفاع والانحدار والاتجاه.
  • يختار poi جميع نقاط الاهتمام.
    • يختار poi.attraction المعالم السياحية.
    • تم اختيار أنشطة تجارية من قِبل poi.business.
    • يختار poi.government المباني الحكومية.
    • يختار poi.medical خدمات الطوارئ، بما في ذلك المستشفيات والصيدليات والشرطة والأطباء وغير ذلك.
    • تم اختيار حدائق من قِبل poi.park.
    • يختار poi.place_of_worship أماكن العبادة، بما في ذلك الكنائس والمعابد والمساجد وغيرها.
    • تم اختيار المؤسسات التعليمية من قِبل "poi.school".
    • يختار poi.sports_complex المجمّعات الرياضية.
  • يختار road كل الطرق.
    • يختار road.arterial الطرق الرئيسية.
    • يختار road.highway الطرق السريعة.
    • يختار road.highway.controlled_access الطرق السريعة التي يتم التحكّم فيها.
    • يختار road.local الطرق المحلية.
  • يختار transit جميع محطات وخطوط النقل العام.
    • يختار transit.line خطوط النقل العام.
    • يختار transit.station جميع محطات النقل العام.
    • يتم اختيار المطارات من قِبل transit.station.airport.
    • يختار transit.station.bus محطات الحافلات.
    • يختار transit.station.rail محطات السكك الحديدية.
  • يختار water مسطحات مائية.

العناصر

يلون إعلان style التالي تسميات جميع الطرق المحلية:

style=feature:road.local|element:labels|color:0xffffff

العناصر هي أقسام فرعية للميزة. تتألف الطريق، على سبيل المثال، من الخط الرسومي (الهندسة) على الخريطة، بالإضافة إلى النص الذي يشير إلى اسمها (تصنيف).

تتوفّر العناصر التالية، ولكن يُرجى العِلم أنّ ميزة معيّنة قد لا تتيح أيًا من هذه العناصر أو بعض منها أو جميعها:

  • يؤدي اختيار all (تلقائيًا) إلى اختيار جميع عناصر الميزة المحددة.
  • يختار geometry جميع العناصر الهندسية للميزة المحددة.
    • تختار دالة geometry.fill تعبئة الهندسة البرمجية للميزة فقط.
    • يختار geometry.stroke فقط سُمك الخط الهندسي للميزة.
  • يختار labels التصنيفات النصية المرتبطة بالميزة المحددة.
    • لا يختار labels.icon سوى الرمز المعروض ضمن تصنيف العنصر.
    • يختار labels.text نص التصنيف فقط.
    • يختار labels.text.fill تعبئة التصنيف فقط. ويتم عادةً عرض تعبئة التصنيف كمخطط ملون يحيط بنص التصنيف.
    • يختار labels.text.stroke ضغط نص التصنيف فقط.

قواعد النمط

قواعد النمط هي خيارات تنسيق يتم تطبيقها على الميزات والعناصر المحددة في كل تعريف style.

يطبّق بيان style التالي قاعدتَي نمط على الطرق على الخريطة. تطبق القاعدة الأولى لونًا على الطرق. أما القاعدة الثانية، فتبسّط عرض الطرق، بحيث تحتوي على خطوط أكثر سمكًا بدون مخطط تفصيلي:

style=feature:road|color:0xffffff|visibility:simplified

يجب أن يحتوي كل تصريح style على عملية واحدة أو أكثر مفصولة باستخدام الشرطة الرأسية ("|"). تحدد كل عملية قيمة الوسيطة باستخدام حرف النقطتين (":")، ويتم تطبيق جميع العمليات على التحديد بالترتيب الذي تحدده.

تتوفر خيارات النمط التالية:

  • hue (سلسلة سداسية عشرية بتنسيق RGB #RRGGBB) تشير إلى اللون الأساسي.

    ملاحظة: يؤدي هذا الخيار إلى ضبط تدرُّج اللون مع الحفاظ على تشبُّع اللون والإضاءة المحدَّدين في نمط Google التلقائي (أو في خيارات النمط الأخرى التي تحدّدها على الخريطة). ويكون اللون الناتج مرتبطًا بنمط الخريطة الأساسية. إذا أجرى Google أي تغييرات على نمط الخريطة الأساسي، ستؤثر التغييرات في ميزات الخريطة التي تم تصميمها بنمط hue. من الأفضل استخدام تصميم color المطلق إذا أمكن.

  • lightness (قيمة النقطة العائمة بين -100 و100) تشير إلى النسبة المئوية للتغيير في سطوع العنصر. تزيد القيم السالبة من درجة التعتيم (حيث تشير القيمة -100 إلى اللون الأسود) بينما تزيد القيم الموجبة من درجة السطوع (حيث تحدد +100 اللون الأبيض).

    ملاحظة: يضبط هذا الخيار مستوى الإضاءة مع الحفاظ على تشبُّع اللون وتدرج اللون المحددَين في نمط Google التلقائي (أو في خيارات النمط الأخرى التي تحدّدها على الخريطة). ويكون اللون الناتج مرتبطًا بنمط الخريطة الأساسية. إذا أجرى Google أي تغييرات على نمط الخريطة الأساسي، ستؤثر التغييرات في ميزات الخريطة التي تم تصميمها بنمط lightness. وبالتالي، من الأفضل استخدام مصمِّم إطارات color الكامل إذا أمكن.

  • تشير قيمة saturation (قيمة النقطة العائمة بين -100 و100) إلى النسبة المئوية للتغيّر في كثافة اللون الأساسي المطلوب تطبيقه على العنصر.

    ملاحظة: يؤدي هذا الخيار إلى ضبط التشبع مع الحفاظ على تدرُّج اللون والإضاءة المحدَّدين في نمط Google التلقائي (أو في خيارات النمط الأخرى التي تحدّدها على الخريطة). ويكون اللون الناتج مرتبطًا بنمط الخريطة الأساسية. إذا أجرى Google أي تغييرات على نمط الخريطة الأساسي، ستؤثر التغييرات في ميزات الخريطة التي تم تصميمها بنمط saturation. من الأفضل استخدام مصفّف شعر color الكامل إن أمكن.

  • وتشير قيمة النقطة gamma (قيمة النقطة العائمة بين 0.01 و10.0، حيث لا تستخدم 1.0 القيمة أي تصحيح) إلى مقدار تصحيح غاما المطلوب تطبيقه على العنصر. تعدّل تصحيحات غاما سطوع الألوان بطريقة غير خطية، بدون التأثير في القيم البيضاء أو السوداء. يتم عادةً استخدام تصحيح غاما لتعديل تباين العناصر المتعددة. على سبيل المثال، يمكنك تعديل غاما لزيادة التباين بين حواف العناصر وداخلها أو تقليله.

    ملاحظة: يضبط هذا الخيار درجة الإضاءة حسب نمط Google التلقائي، وذلك باستخدام منحنى غاما. إذا أجرى محرّك بحث Google أي تغييرات على نمط الخريطة الأساسي، ستؤثر التغييرات في ميزات الخريطة التي تم تصميمها بنمط gamma. من الأفضل استخدام تصميم color المطلق إذا أمكن.

  • تعمل القيمة invert_lightness (إذا كانت true) على عكس مستوى الإضاءة الحالي. ويكون هذا الإجراء مفيدًا على سبيل المثال للتبديل سريعًا إلى خريطة أكثر قتامة بنص أبيض.

    ملاحظة: يعكس هذا الخيار نمط Google التلقائي. إذا أجرى محرّك بحث Google أي تغييرات على نمط الخريطة الأساسي، ستؤثر التغييرات في ميزات الخريطة التي تم تصميمها بنمط invert_lightness. من الأفضل استخدام مصفّف شعر color الكامل إن أمكن.

  • تشير السمة visibility (on أو off أو simplified) إلى ما إذا كان العنصر سيظهر على الخريطة وطريقة عرضه. تزيل إمكانية رؤية simplified بعض ميزات النمط من الميزات المتأثرة. على سبيل المثال، يتم تبسيط الطرق إلى خطوط أكثر سمكًا بدون مخططات تفصيلية، بينما تفقد المتنزهات نص التصنيف الخاص بها ولكنها تحتفظ برمز التصنيف.
  • تحدّد color (سلسلة سداسية عشرية بتنسيق RGB #RRGGBB) لون الميزة.
  • weight (قيمة عدد صحيح أكبر من أو تساوي صفر) يحدّد وزن العنصر بالبكسل. قد يؤدي ضبط الوزن على قيمة عالية إلى اقتصاصه بالقرب من حدود المربّعات.

يتم تطبيق قواعد النمط بالترتيب الذي تحدّده. لا تدمج عمليات متعددة في عملية نمط واحد. بدلاً من ذلك، يمكنك تحديد كل عملية باعتبارها إدخالاً منفصلاً في صفيف النمط.

ملاحظة: الترتيب مهم، لأن بعض العمليات ليست إبدالية. العناصر و/أو العناصر التي تم تعديلها من خلال عمليات الأنماط (عادةً) لها أنماط حالية. تعمل العمليات على تلك الأنماط الحالية، إن وُجدت.

نموذج تدرج اللون والتشبع والإضاءة

تستخدم الخرائط ذات التصميم نماذج تدرج اللون وتشبّع اللون والإضاءة (HSL) للإشارة إلى اللون ضمن عمليات المصمم. يشير تدرج اللون إلى اللون الأساسي، في حين يشير التشبع إلى كثافة ذلك اللون، ويشير الإضاءة إلى المقدار النسبي للأبيض أو الأسود في اللون المكون.

تعمل ميزة تصحيح أشعة جاما على تعديل درجة الإضاءة فوق مساحة اللون، بشكل عام لزيادة التباين أو تقليله. إضافةً إلى ذلك، يحدّد نموذج HSL اللون في المساحة الإحداثية حيث تشير السمة hue إلى الاتجاه في بكرة الألوان، في حين يشير التشبع والإضاءة إلى الاتساع على المحاور المختلفة. يتم قياس تدرجات اللون ضمن مساحة اللون نموذج أحمر أخضر أزرق (RGB)، وهو ما يشبه معظم مساحات الألوان الأحمر والأخضر والأزرق، باستثناء أنّ ظلال اللونين الأبيض والأسود غير موجودة.

تدرج اللون، التشبع، نموذج الإضاءة

يأخذ hue قيمة لون سداسية عشرية في HTML، إلّا أنّه لا يستخدم هذه القيمة إلا لتحديد اللون الأساسي، أي اتجاهه حول عجلة الألوان، وليس تشبُّع اللون أو سطوعه، وهو ما يتم الإشارة إليه بشكل منفصل عن طريق تغيّر النسبة المئوية.

على سبيل المثال، يمكنك تحديد تدرُّج اللون الأخضر الخالص على النحو التالي: hue:0x00ff00 أو hue:0x000100. وكلا اللونين متطابقين. تشير كلتا القيمتين إلى اللون الأخضر النقي في نموذج ألوان HSL.

عجلة ألوان نموذج أحمر أخضر أزرق

أمّا قيم hue للنموذج الأحمر والأخضر والأزرق، والتي تتكوّن من أجزاء متساوية باللونين الأحمر والأخضر والأزرق، فلا تشير إلى تدرج اللون، لأنّ أيًّا من هذه القيم لا يشير إلى اتجاه في مساحة إحداثي HSL. تشمل الأمثلة "#000000" (أسود) و"#FFFFFF" (أبيض) وجميع الظلال الخالصة للرمادي. للإشارة إلى الأسود أو الأبيض أو الرمادي، يجب إزالة saturation بالكامل (ضبط القيمة على -100) وتعديل lightness بدلاً من ذلك.

بالإضافة إلى ذلك، عند تعديل الميزات الحالية التي تتضمّن ألوانًا، لن يؤدي تغيير قيمة مثل hue إلى تغيير saturation أو lightness الحالية.