مرجع نمط واجهة برمجة تطبيقات Tiles API

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

أمثلة

يحوّل تعريف نمط JSON التالي جميع عناصر الخريطة إلى اللون الرمادي، ثم يلوّن شكل الطريق الشرياني باللون الأزرق، ويخفي تصنيفات المناظر الطبيعية تمامًا:

[
  {
    "featureType": "all",
    "stylers": [
      { "color": "#C0C0C0" }
    ]
  },{
    "featureType": "road.arterial",
    "elementType": "geometry",
    "stylers": [
      { "color": "#CCFFFF" }
    ]
  },{
    "featureType": "landscape",
    "elementType": "labels",
    "stylers": [
      { "visibility": "off" }
    ]
  }
]

كائن JSON

يتألف بيان نمط JSON من العناصر التالية:

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

لتحديد نمط، يجب الجمع بين مجموعة من أدوات الاختيار featureType وelementType وstylers في مصفوفة أنماط. يمكنك استهداف أي مجموعة من الميزات في مصفوفة واحدة. ومع ذلك، فإنّ عدد الأنماط التي يمكنك تطبيقها في المرة الواحدة محدود. إذا تجاوزت مصفوفة الأنماط الحدّ الأقصى لعدد الأحرف، لن يتم تطبيق أي نمط.

يتضمّن بقية هذه الصفحة مزيدًا من المعلومات حول الميزات والعناصر وأدوات التنسيق.

featureType

يختار مقتطف JSON التالي جميع الطرق على الخريطة:

{
  "featureType": "road"
}

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

تشكّل الميزات شجرة فئات، ويكون 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 المسطحات المائية.

elementType

يختار مقتطف JSON التالي التصنيفات لجميع الطرق المحلية:

{
  "featureType": "road.local",
  "elementType": "labels"
}

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

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

يتغيّر لون نص التصنيف fill وstroke استنادًا إلى مستوى التكبير/التصغير. للحفاظ على اتساق التجربة على جميع مستويات التكبير أو التصغير، عليك دائمًا تحديد كل من fill وstroke.

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

stylers

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

يعرض مقتطف JSON التالي ميزة باللون الأخضر الفاتح، وذلك باستخدام قيمة RGB:

"stylers": [
  { "color": "#99FF33" }
]

يزيل مقتطف الرمز البرمجي هذا كل كثافة من لون عنصر، بغض النظر عن لونه الأولي. ويتمثل التأثير في عرض الميزة بتدرّج الرمادي:

"stylers": [
  { "saturation": -100 }
]

يخفي هذا المقتطف إحدى الميزات تمامًا:

    "stylers": [
      { "visibility": "off" }
    ]

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

• يشير hue (سلسلة سداسية عشرية بنموذج أحمر أخضر أزرق #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 (if true) تعكس درجة السطوع الحالية. ويكون ذلك مفيدًا، مثلاً، للتبديل بسرعة إلى خريطة داكنة بنص أبيض.

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

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

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

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

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

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

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

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

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

عجلة ألوان RGB

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

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