أشكال

اختيار النظام الأساسي: Android‏ iOS‏ JavaScript‏

خريطة مع خطوط متعدّدة حمراء بلون واحد

توفّر واجهة برمجة تطبيقات "خرائط Google" لنظام التشغيل Android بعض الطرق البسيطة لإضافة أشكال إلى خرائطك من أجل تخصيصها لتطبيقك.

  • Polyline هو سلسلة من مقاطع الخطوط المتصلة التي يمكن أن تشكّل أي شكل تريده ويمكن استخدامها لتحديد المسارات والطرق على الخريطة.
  • Polygon هو شكل مغلق يمكن استخدامه لتحديد مناطق على الخريطة.
  • Circle هو إسقاط دقيق جغرافيًا لدائرة على سطح الأرض مرسومة على الخريطة.

بالنسبة إلى كل هذه الأشكال، يمكنك تخصيص مظهرها من خلال تغيير عدد من الخصائص.

عيّنات تعليمات برمجية

يتضمّن البرنامج التعليمي حول إضافة المضلّعات والخطوط المتعدّدة لتمثيل المناطق والمسارات جميع الرموز البرمجية لتطبيق Android بسيط.

بالإضافة إلى ذلك، يتضمّن مستودع ApiDemos على GitHub نماذج توضّح استخدام الأشكال وميزاتها:

  • ‫CircleDemoActivity ‏ (Java / Kotlin): دائرة
  • ‫PolygonDemoActivity ‏ (Java / Kotlin): مضلّع
  • ‫PolylineDemoActivity ‏ (Java / Kotlin): خطوط متعدّدة

خطوط متعدّدة

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

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

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

لإضافة نقاط إلى عنصر PolylineOptions، يمكنك استدعاء PolylineOptions.add(). يُرجى العِلم أنّ هذه الطريقة تستخدم عددًا متغيرًا من المَعلمات، لذا يمكنك إضافة نقاط متعددة في كل مرة (يمكنك أيضًا استدعاء PolylineOptions.addAll(Iterable<LatLng>) إذا كانت النقاط مدرَجة في قائمة).

ويمكنك بعد ذلك إضافة الخطوط المتعدّدة إلى خريطة من خلال استدعاء GoogleMap.addPolyline(PolylineOptions). يعرض الإجراء عنصر Polyline يمكنك من خلاله تغيير الخطوط المتعدّدة في وقت لاحق.

يوضّح مقتطف الرمز التالي كيفية إضافة مستطيل إلى خريطة:

Kotlin

// Instantiates a new Polyline object and adds points to define a rectangle
val polylineOptions = PolylineOptions()
    .add(LatLng(37.35, -122.0))
    .add(LatLng(37.45, -122.0)) // North of the previous point, but at the same longitude
    .add(LatLng(37.45, -122.2)) // Same latitude, and 30km to the west
    .add(LatLng(37.35, -122.2)) // Same longitude, and 16km to the south
    .add(LatLng(37.35, -122.0)) // Closes the polyline.

// Get back the mutable Polyline
val polyline = map.addPolyline(polylineOptions)

      

جافا

// Instantiates a new Polyline object and adds points to define a rectangle
PolylineOptions polylineOptions =
        new PolylineOptions()
                .add(new LatLng(37.35, -122.0))
                .add(
                        new LatLng(
                                37.45,
                                -122.0)) // North of the previous point, but at the same
                // longitude
                .add(new LatLng(37.45, -122.2)) // Same latitude, and 30km to the west
                .add(new LatLng(37.35, -122.2)) // Same longitude, and 16km to the south
                .add(new LatLng(37.35, -122.0)); // Closes the polyline.

// Get back the mutable Polyline
Polyline polyline = map.addPolyline(polylineOptions);

      

يظهر المستطيل على الخريطة كما هو موضّح أدناه:

خريطة تتضمّن شكلاً متعدّد الخطوط مستطيلاً

لتغيير شكل الخط المتعدّد بعد إضافته، يمكنك استدعاء Polyline.setPoints() وتقديم قائمة جديدة من النقاط للخط المتعدّد.

يمكنك تخصيص مظهر الخطوط المتعدّدة قبل إضافتها إلى الخريطة وبعد إضافتها إليها. يُرجى الاطّلاع على القسم حول تخصيص المظاهر أدناه لمزيد من التفاصيل.

تخصيص الخطوط المتعدّدة

هناك عدة طرق لتخصيص مظهر الخطوط المتعدّدة:

  • تضبط الخطوط المتعددة الألوان أجزاء الخطوط المتعددة على ألوان مختلفة.
  • الخطوط المتعدّدة المتدرّجة هي خطوط متعدّدة ملوّنة باستخدام تدرّج من لونَين.
  • تُستخدَم الخطوط المتعدّدة المختومة لتنسيق خط متعدّد باستخدام صور نقطية متكرّرة.

لاستخدام تخصيصات الخطوط المتعدّدة، استخدِم الإصدار 18.1.0 أو إصدارًا أحدث من "حزمة تطوير البرامج بالاستناد إلى بيانات خرائط Google للتطبيقات المتوافقة مع Android" واستخدِم أحدث إصدار من "أداة عرض حزمة تطوير البرامج بالاستناد إلى بيانات خرائط Google للتطبيقات المتوافقة مع Android".

إنشاء خطوط متعدّدة الألوان

خريطة تتضمّن خطوطًا متعدّدة الألوان

يمكنك استخدام الامتدادات لتلوين أجزاء من خطوط متعدّدة بشكل فردي، وذلك من خلال إنشاء عناصر StyleSpan وإضافتها إلى PolylineOptions باستخدام الطريقتَين addSpan() أو addSpans(). بشكل تلقائي، سيضبط كل عنصر في الصفيفة لون الجزء المقابل من الخط. يوضّح المثال التالي كيفية ضبط ألوان الأجزاء لإنشاء خطوط متعدّدة بأجزاء حمراء وخضراء:

Kotlin

val line = map.addPolyline(
    PolylineOptions()
        .add(LatLng(47.6677146, -122.3470447), LatLng(47.6442757, -122.2814693))
        .addSpan(StyleSpan(Color.RED))
        .addSpan(StyleSpan(Color.GREEN)),
)

      

جافا

Polyline line =
        map.addPolyline(
                new PolylineOptions()
                        .add(
                                new LatLng(47.6677146, -122.3470447),
                                new LatLng(47.6442757, -122.2814693))
                        .addSpan(new StyleSpan(Color.RED))
                        .addSpan(new StyleSpan(Color.GREEN)));

      

إنشاء خطوط متعدّدة متدرّجة

خريطة تتضمّن خطوطًا متعدّدة متدرّجة

يمكنك تحديد تدرج من خلال تحديد عددَين صحيحَين من نوع alpha-red-green-blue (ARGB)‎ بحجم 32 بت، لتحديد لونَي بداية الخط ونهايته. يمكنك ضبط هذه السمة في عنصر خيارات الشكل من خلال استدعاء PolylineOptions.addSpan(). يوضّح المثال التالي كيفية إنشاء خط متعدّد متدرّج من الأحمر إلى الأصفر من حديقة حيوان وودلاند بارك إلى كيركلاند، واشنطن.

Kotlin

val line = map.addPolyline(
    PolylineOptions()
        .add(LatLng(47.6677146, -122.3470447), LatLng(47.6442757, -122.2814693))
        .addSpan(
            StyleSpan(
                StrokeStyle.gradientBuilder(
                    Color.RED,
                    Color.YELLOW,
                ).build(),
            ),
        ),
)

      

جافا

Polyline line =
        map.addPolyline(
                new PolylineOptions()
                        .add(
                                new LatLng(47.6677146, -122.3470447),
                                new LatLng(47.6442757, -122.2814693))
                        .addSpan(
                                new StyleSpan(
                                        StrokeStyle.gradientBuilder(Color.RED, Color.YELLOW)
                                                .build())));

      

إنشاء خطوط متعدّدة مختومة

خريطة تتضمّن خطوطًا متعدّدة مختومة

يمكنك ضبط مظهر الخطوط المتعدّدة على شكل زخرفة نقطية متكرّرة. لإجراء ذلك، أنشئ StampStyle من TextureStyle، ثم اضبط هذه السمة في عنصر خيارات الشكل من خلال استدعاء PolylineOptions.addSpan() كما هو موضّح هنا:

Kotlin

val stampStyle =
    TextureStyle.newBuilder(BitmapDescriptorFactory.fromResource(R.drawable.walking_dot)).build()
val span = StyleSpan(StrokeStyle.colorBuilder(Color.RED).stamp(stampStyle).build())
map.addPolyline(
    PolylineOptions()
        .add(LatLng(47.6677146, -122.3470447), LatLng(47.6442757, -122.2814693))
        .addSpan(span),
)

      

جافا

StampStyle stampStyle =
        TextureStyle.newBuilder(
                        BitmapDescriptorFactory.fromResource(R.drawable.walking_dot))
                .build();
StyleSpan span =
        new StyleSpan(StrokeStyle.colorBuilder(Color.RED).stamp(stampStyle).build());
map.addPolyline(
        new PolylineOptions()
                .add(
                        new LatLng(47.6677146, -122.3470447),
                        new LatLng(47.6442757, -122.2814693))
                .addSpan(span));

      

أحداث الخطوط المتعدّدة

لا يمكن النقر على الخطوط المتعدّدة تلقائيًا. يمكنك تفعيل ميزة "قابلية النقر" وإيقافها من خلال استدعاء Polyline.setClickable(boolean).

استخدِم OnPolylineClickListener للاستماع إلى الأحداث الناتجة عن النقر على خطوط متعدّدة قابلة للنقر. لضبط هذا المستمع على الخريطة، استخدِم GoogleMap.setOnPolylineClickListener(OnPolylineClickListener). عندما ينقر مستخدم على خط متعدّد، ستتلقّى دالة ردّ اتصال onPolylineClick(Polyline).

المضلّعات

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

يمكنك إضافة Polygon إلى الخريطة بالطريقة نفسها التي تضيف بها Polyline. أولاً، أنشئ عنصر PolygonOptions وأضِف بعض النقاط إليه. ستشكّل هذه النقاط المخطط التفصيلي للمضلّع. بعد ذلك، يمكنك إضافة المضلّع إلى الخريطة من خلال استدعاء GoogleMap.addPolygon(PolygonOptions)، ما يؤدي إلى عرض عنصر Polygon.

يضيف مقتطف الرمز التالي مستطيلاً إلى خريطة.

Kotlin

// Instantiates a new Polygon object and adds points to define a rectangle
val rectOptions = PolygonOptions()
    .add(
        LatLng(37.35, -122.0),
        LatLng(37.45, -122.0),
        LatLng(37.45, -122.2),
        LatLng(37.35, -122.2),
        LatLng(37.35, -122.0),
    )

// Get back the mutable Polygon
val polygon = map.addPolygon(rectOptions)

      

جافا

// Instantiates a new Polygon object and adds points to define a rectangle
PolygonOptions polygonOptions =
        new PolygonOptions()
                .add(
                        new LatLng(37.35, -122.0),
                        new LatLng(37.45, -122.0),
                        new LatLng(37.45, -122.2),
                        new LatLng(37.35, -122.2),
                        new LatLng(37.35, -122.0));

// Get back the mutable Polygon
Polygon polygon = map.addPolygon(polygonOptions);

      

لتغيير شكل المضلّع بعد إضافته، يمكنك استدعاء Polygon.setPoints() وتقديم قائمة جديدة من النقاط لمخطط المضلّع.

يمكنك تخصيص مظهر المضلّع قبل إضافته إلى الخريطة وبعد إضافته إليها. يُرجى الاطّلاع على القسم حول تخصيص المظاهر أدناه لمزيد من التفاصيل.

الإكمال التلقائي للمضلّعات

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

المضلّعان أدناه متكافئان، وسيؤدي استدعاء polygon.getPoints() لكل منهما إلى عرض جميع النقاط الأربع.

Kotlin

val polygon1 = map.addPolygon(
    PolygonOptions()
        .add(
            LatLng(0.0, 0.0),
            LatLng(0.0, 5.0),
            LatLng(3.0, 5.0),
            LatLng(0.0, 0.0),
        )
        .strokeColor(Color.RED)
        .fillColor(Color.BLUE),
)
val polygon2 = map.addPolygon(
    PolygonOptions()
        .add(
            LatLng(0.0, 0.0),
            LatLng(0.0, 5.0),
            LatLng(3.0, 5.0),
        )
        .strokeColor(Color.RED)
        .fillColor(Color.BLUE),
)

      

جافا

Polygon polygon1 =
        map.addPolygon(
                new PolygonOptions()
                        .add(
                                new LatLng(0, 0),
                                new LatLng(0, 5),
                                new LatLng(3, 5),
                                new LatLng(0, 0))
                        .strokeColor(Color.RED)
                        .fillColor(Color.BLUE));

Polygon polygon2 =
        map.addPolygon(
                new PolygonOptions()
                        .add(new LatLng(0, 0), new LatLng(0, 5), new LatLng(3, 5))
                        .strokeColor(Color.RED)
                        .fillColor(Color.BLUE));

      

إنشاء مضلّع مجوّف

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

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

سينشئ المقتطف أدناه مستطيلاً واحدًا، مع فتحة مستطيلة أصغر.

Kotlin

val hole = listOf(
    LatLng(1.0, 1.0),
    LatLng(1.0, 2.0),
    LatLng(2.0, 2.0),
    LatLng(2.0, 1.0),
    LatLng(1.0, 1.0),
)
val hollowPolygon = map.addPolygon(
    PolygonOptions()
        .add(
            LatLng(0.0, 0.0),
            LatLng(0.0, 5.0),
            LatLng(3.0, 5.0),
            LatLng(3.0, 0.0),
            LatLng(0.0, 0.0),
        )
        .addHole(hole)
        .fillColor(Color.BLUE),
)

      

جافا

List<LatLng> hole =
        Arrays.asList(
                new LatLng(1, 1),
                new LatLng(1, 2),
                new LatLng(2, 2),
                new LatLng(2, 1),
                new LatLng(1, 1));
Polygon hollowPolygon =
        map.addPolygon(
                new PolygonOptions()
                        .add(
                                new LatLng(0, 0),
                                new LatLng(0, 5),
                                new LatLng(3, 5),
                                new LatLng(3, 0),
                                new LatLng(0, 0))
                        .addHole(hole)
                        .fillColor(Color.BLUE));

      

يظهر المضلّع المجوّف على الخريطة كما هو موضّح أدناه:

خريطة تتضمّن خطوطًا متعدّدة على شكل مستطيل مجوّف

أحداث المضلّعات

لا يمكن النقر على المضلّعات تلقائيًا. يمكنك تفعيل ميزة "قابلية النقر" وإيقافها من خلال استدعاء Polygon.setClickable(boolean).

استخدِم OnPolygonClickListener للاستماع إلى الأحداث الناتجة عن النقر على مضلّع قابل للنقر. لضبط هذا المستمع على الخريطة، استخدِم GoogleMap.setOnPolygonClickListener(OnPolygonClickListener). عندما ينقر مستخدم على مضلّع، ستتلقّى دالة ردّ اتصال onPolygonClick(Polygon).

دوائر

خريطة مع دائرة

بالإضافة إلى فئة Polygon العامة، تتضمّن واجهة برمجة التطبيقات Maps API أيضًا فئات محدّدة لكائنات Circle، لتبسيط إنشائها.

لإنشاء دائرة، يجب تحديد السمتَين التاليتَين:

  • ‫center كـ LatLng
  • ‫radius بالأمتار

يتم بعد ذلك تحديد دائرة لتكون مجموعة من جميع النقاط على سطح الأرض التي تبعد radius متر عن center المحدّد. بسبب الطريقة التي يعرض بها إسقاط مركاتور المستخدم في Maps API كرة على سطح مستوٍ، سيظهر هذا كدائرة مثالية تقريبًا على الخريطة عندما يكون بالقرب من خط الاستواء، وسيظهر بشكل متزايد غير دائري (على الشاشة) عندما تبتعد الدائرة عن خط الاستواء.

لتغيير شكل الدائرة بعد إضافتها، يمكنك استدعاء Circle.setRadius() أو Circle.setCenter() وتقديم قيم جديدة.

يمكنك تخصيص مظهر الدائرة قبل إضافتها إلى الخريطة وبعد إضافتها. يُرجى الاطّلاع على القسم حول تخصيص المظاهر أدناه لمزيد من التفاصيل.

يضيف مقتطف الرمز التالي دائرة إلى الخريطة من خلال إنشاء عنصر CircleOptions واستدعاء GoogleMap.addCircle(CircleOptions):

Kotlin

// Instantiates a new CircleOptions object and defines the center and radius
val circleOptions = CircleOptions()
    .center(LatLng(37.4, -122.1))
    .radius(1000.0) // In meters

// Get back the mutable Circle
val circle = map.addCircle(circleOptions)

      

جافا

// Instantiates a new CircleOptions object and defines the center and radius
CircleOptions circleOptions =
        new CircleOptions().center(new LatLng(37.4, -122.1)).radius(1000); // In meters

// Get back the mutable Circle
Circle circle = map.addCircle(circleOptions);

      

أحداث الدائرة

لا يمكن النقر على الدوائر تلقائيًا. يمكنك تفعيل ميزة إمكانية النقر وإيقافها من خلال استدعاء GoogleMap.addCircle() باستخدام CircleOptions.clickable(boolean) أو من خلال استدعاء Circle.setClickable(boolean).

استخدِم OnCircleClickListener للاستماع إلى الأحداث الناتجة عن النقر على دائرة قابلة للنقر. لضبط هذا المستمع على الخريطة، استخدِم GoogleMap.setOnCircleClickListener(OnCircleClickListener).

عندما ينقر المستخدم على دائرة، ستتلقّى دالة ردّ اتصال onCircleClick(Circle)، كما هو موضّح في عينة التعليمات البرمجية التالية:

Kotlin

val circle = map.addCircle(
    CircleOptions()
        .center(LatLng(37.4, -122.1))
        .radius(1000.0)
        .strokeWidth(10f)
        .strokeColor(Color.GREEN)
        .fillColor(Color.argb(128, 255, 0, 0))
        .clickable(true),
)
map.setOnCircleClickListener {
    // Flip the r, g and b components of the circle's stroke color.
    val strokeColor = it.strokeColor xor 0x00ffffff
    it.strokeColor = strokeColor
}

      

جافا

Circle circle =
        map.addCircle(
                new CircleOptions()
                        .center(new LatLng(37.4, -122.1))
                        .radius(1000)
                        .strokeWidth(10)
                        .strokeColor(Color.GREEN)
                        .fillColor(Color.argb(128, 255, 0, 0))
                        .clickable(true));

map.setOnCircleClickListener(
        new GoogleMap.OnCircleClickListener() {
            @Override
            public void onCircleClick(Circle circle) {
                // Flip the r, g and b components of the circle's stroke color.
                int strokeColor = circle.getStrokeColor() ^ 0x00ffffff;
                circle.setStrokeColor(strokeColor);
            }
        });

      

تخصيص المظاهر

يمكنك تغيير مظهر الشكل قبل إضافته إلى الخريطة (من خلال تحديد السمة المطلوبة في عنصر الخيارات) أو بعد إضافته إلى الخريطة. يتم أيضًا عرض دوال الحصول على القيمة لجميع السمات حتى تتمكّن من الوصول بسهولة إلى الحالة الحالية للشكل.

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

Kotlin

val polyline = map.addPolyline(
    PolylineOptions()
        .add(LatLng(-37.81319, 144.96298), LatLng(-31.95285, 115.85734))
        .width(25f)
        .color(Color.BLUE)
        .geodesic(true),
)

      

جافا

Polyline polyline =
        map.addPolyline(
                new PolylineOptions()
                        .add(
                                new LatLng(-37.81319, 144.96298),
                                new LatLng(-31.95285, 115.85734))
                        .width(25)
                        .color(Color.BLUE)
                        .geodesic(true));

      

تظهر الخريطة كما هو موضّح أدناه:

خريطة مع خطوط متعدّدة من ملبورن إلى بيرث

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

لون الشطب

لون الخط هو عدد صحيح من نوع ARGB (ألفا-أحمر-أخضر-أزرق) بحجم 32 بت يحدّد درجة التعتيم ولون خط الشكل. يمكنك ضبط هذه السمة في عنصر خيارات الشكل من خلال استدعاء *Options.strokeColor() (أو PolylineOptions.color() في حالة الخطوط المتعدّدة). في حال عدم تحديدها، يكون لون الخط التلقائي هو الأسود (Color.BLACK).

بعد إضافة الشكل إلى الخريطة، يمكن الوصول إلى لون الخط من خلال استدعاء getStrokeColor() (أو getColor() لخط متعدّد) ويمكن تغييره من خلال استدعاء setStrokeColor() (setColor() for a polyline).

لون التعبئة

ينطبق لون التعبئة على المضلّعات والدوائر فقط. ولا ينطبق على الخطوط المتعدّدة لأنّها لا تحتوي على أجزاء داخلية محدّدة. بالنسبة إلى المضلّع، لا تشكّل المناطق داخل الفجوات جزءًا من المساحة الداخلية للمضلّع ولن يتم تلوينها في حال ضبط لون تعبئة.

لون التعبئة هو عدد صحيح من نوع ARGB (ألفا-أحمر-أخضر-أزرق) بحجم 32 بت يحدّد درجة التعتيم ولون الجزء الداخلي من الشكل. اضبط هذه السمة على كائن خيارات الشكل من خلال استدعاء *Options.fillColor(). في حال عدم تحديدها، يكون لون الحدّ التلقائي شفافًا (Color.TRANSPARENT).

بعد إضافة الشكل إلى الخريطة، يمكن الوصول إلى لون التعبئة من خلال استدعاء getFillColor() ويمكن تغييره من خلال استدعاء setFillColor().

عرض الكتابة

عرض خط الرسم، كقيمة عائمة بالبكسل (px). لا يتغيّر العرض عند تكبير الخريطة أو تصغيرها (أي أنّ الشكل سيكون له عرض الخط نفسه في جميع مستويات التكبير). اضبط هذه السمة على عنصر خيار الشكل من خلال استدعاء *Options.strokeWidth() (أو PolylineOptions.width() لخط متعدّد). إذا لم يتم تحديدها، يكون عرض الخط التلقائي 10 بكسل.

بعد إضافة الشكل إلى الخريطة، يمكن الوصول إلى عرض الخط من خلال استدعاء getStrokeWidth() (أو getWidth() للخطوط المتعدّدة) ويمكن تغييره من خلال استدعاء setStrokeWidth() (setWidth() for a polyline).

نمط الخط

نمط الخط التلقائي هو خط متصل للأشكال المتعدّدة الخطوط وللمخططات التفصيلية للمضلّعات والدوائر. يمكنك تحديد نمط خط مخصّص لكائنات PatternItem، حيث يكون كل عنصر عبارة عن شرطة أو نقطة أو فجوة.

يضبط النموذج التالي نمط الخط المتعدّد على تسلسل متكرّر من نقطة، متبوعة بمسافة بطول 20 بكسل، وشرطة بطول 30 بكسل، ومسافة أخرى بطول 20 بكسل.

Kotlin

val pattern = listOf(
    Dot(),
    Gap(20F),
    Dash(30F),
    Gap(20F),
)
polyline?.pattern = pattern

      

جافا

List<PatternItem> pattern =
        Arrays.asList(new Dot(), new Gap(20), new Dash(30), new Gap(20));
polyline.setPattern(pattern);

      

يتكرر النمط على طول الخط، بدءًا من عنصر النمط الأول عند الرأس الأول المحدد للشكل.

أنواع المفاصل

بالنسبة إلى الخطوط المتعدّدة والخطوط الخارجية للمضلّعات، يمكنك تحديد زاوية مائلة أو مستديرة JointType لاستبدال نوع الوصلة المائلة الثابتة التلقائية.

يطبّق النموذج التالي نوع وصلة مستديرة على خطوط متعدّدة:

Kotlin

polyline?.jointType = JointType.ROUND

      

جافا

polyline.setJointType(JointType.ROUND);

      

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

نهايات الخطوط

يمكنك تحديد نمط Cap لكل طرف من الخطوط المتعدّدة. الخيارات هي butt (تلقائي) أو square أو round أو صورة نقطية مخصّصة. اضبط النمط في PolylineOptions.startCap وPolylineOptions.endCap، أو استخدِم إجراءات getter وsetter المناسبة.

يحدّد المقتطف التالي غطاءً دائريًا في بداية خط متعدّد.

Kotlin

polyline?.startCap = RoundCap()

      

جافا

polyline.setStartCap(new RoundCap());

      

يحدّد المقتطف التالي صورة نقطية مخصّصة للغطاء الطرفي:

Kotlin

polyline?.endCap = CustomCap(BitmapDescriptorFactory.fromResource(R.drawable.arrow), 16F)

      

جافا

polyline.setEndCap(
        new CustomCap(BitmapDescriptorFactory.fromResource(R.drawable.arrow), 16));

      

عند استخدام صورة نقطية مخصّصة، يجب تحديد عرض خط مرجعي بالبكسل. وتعمل واجهة برمجة التطبيقات على تغيير حجم الصورة النقطية وفقًا لذلك. عرض الخط المرجعي هو عرض الخط الذي استخدمته عند تصميم صورة نقطية للغطاء، بالبُعد الأصلي للصورة. عرض الخط المرجعي التلقائي هو 10 بكسل. ملاحظة: لتحديد عرض الخط المرجعي، افتح صورة نقطية في أداة تعديل الصور مع تكبيرها بنسبة %100، وارسم العرض المطلوب للخط بالنسبة إلى الصورة.

إذا كنت تستخدم BitmapDescriptorFactory.fromResource() لإنشاء الصورة النقطية، تأكَّد من استخدام مورد مستقل عن الكثافة (nodpi).

الشرائح الجيوديسية

لا ينطبق الإعداد الجيوديسي إلا على الخطوط المتعدّدة والمضلّعات. ولا ينطبق على الدوائر لأنها لم يتم تعريفها كمجموعة من المقاطع.

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

يمكنك ضبط هذه السمة على عنصر خيار الشكل من خلال استدعاء *Options.geodesic() حيث يشير true إلى أنّه يجب رسم الأجزاء كخطوط جيوديسية ويشير false إلى أنّه يجب رسم الأجزاء كخطوط مستقيمة. في حال عدم تحديدها، تكون القيمة التلقائية هي الأجزاء غير الجيوديسية (false).

بعد إضافة الشكل إلى الخريطة، يمكن الوصول إلى إعدادات الجيوديسية من خلال استدعاء isGeodesic() ويمكن تغييرها من خلال استدعاء setGeodesic().

Z-index

يحدّد الفهرس z ترتيب تكديس هذا الشكل بالنسبة إلى العناصر الأخرى التي تظهر فوق الخريطة (الأشكال الأخرى والعناصر التي تظهر فوق الأرض والعناصر التي تظهر فوق المربّعات). يتم رسم تراكب ذي فهرس z مرتفع فوق التراكبات ذات فهارس z المنخفضة. يتم رسم تراكبَين لهما مؤشر z نفسه بترتيب عشوائي.

يُرجى العِلم أنّه يتم دائمًا رسم العلامات فوق العناصر المركّبة الأخرى، بغض النظر عن مؤشر z للعناصر المركّبة الأخرى.

يمكنك ضبط هذه السمة في عنصر خيارات الشكل من خلال استدعاء *Options.zIndex(). إذا لم يتم تحديد قيمة، تكون قيمة z-index التلقائية هي 0. بعد إضافة الشكل إلى الخريطة، يمكن الوصول إلى فهرس z من خلال استدعاء getZIndex() ويمكن تغييره من خلال استدعاء setZIndex().

مستوى الرؤية

تحدّد سمة مستوى العرض ما إذا كان يجب رسم الشكل على الخريطة، حيث تشير القيمة true إلى أنّه يجب رسمه، بينما تشير القيمة false إلى أنّه لا يجب رسمه. ويسمح لك بعدم عرض شكل على الخريطة مؤقتًا. لإزالة الشكل نهائيًا من الخريطة، يمكنك استدعاء remove() على هذا الشكل.

يمكنك ضبط هذه السمة في عنصر خيارات الشكل من خلال استدعاء *Options.visible(). إذا لم يتم تحديد مستوى العرض، سيكون true هو المستوى التلقائي. بعد إضافة الشكل إلى الخريطة، يمكن الوصول إلى مستوى العرض من خلال استدعاء isVisible() ويمكن تغييره من خلال استدعاء setVisible().

ربط البيانات بشكل

يمكنك تخزين عنصر بيانات عشوائي باستخدام خط متعدّد أو مضلّع أو دائرة باستخدام طريقة setTag() للشكل، واسترداد العنصر باستخدام getTag(). على سبيل المثال، يمكنك استدعاء Polyline.setTag() لتخزين عنصر بيانات باستخدام خطوط متعدّدة، واستدعاء Polyline.getTag() لاسترداد عنصر البيانات.

يحدّد الرمز أدناه علامة عشوائية (A) للخطوط المتعدّدة المحدّدة:

Kotlin

val polyline = map.addPolyline(
    PolylineOptions()
        .clickable(true)
        .add(
            LatLng(-35.016, 143.321),
            LatLng(-34.747, 145.592),
            LatLng(-34.364, 147.891),
            LatLng(-33.501, 150.217),
            LatLng(-32.306, 149.248),
            LatLng(-32.491, 147.309),
        ),
)
polyline?.tag = "A"

      

جافا

Polyline polyline =
        map.addPolyline(
                (new PolylineOptions())
                        .clickable(true)
                        .add(
                                new LatLng(-35.016, 143.321),
                                new LatLng(-34.747, 145.592),
                                new LatLng(-34.364, 147.891),
                                new LatLng(-33.501, 150.217),
                                new LatLng(-32.306, 149.248),
                                new LatLng(-32.491, 147.309)));

polyline.setTag("A");

      

في ما يلي بعض الأمثلة على السيناريوهات التي يكون فيها تخزين البيانات واستردادها مفيدًا باستخدام الأشكال:

  • قد يوفّر تطبيقك أنواعًا مختلفة من الأشكال، وتريد التعامل معها بشكل مختلف عندما ينقر عليها المستخدم.
  • قد تتعامل مع نظام يحتوي على معرّفات سجلات فريدة، حيث تمثل الأشكال سجلات محددة في هذا النظام.
  • قد تشير بيانات الشكل إلى أولوية تحديد مؤشر z للشكل.