إضافة طبقة رموز في iOS SDK (معاينة)

مقالة
04/21/2022
قراءة خلال 4 دقائق

توضح لك هذه المقالة كيفية عرض البيانات النقطية من مصدر بيانات كطبقة رموز على خريطة باستخدام خرائط Azure iOS SDK. تعرض طبقات الرمز النقاط كصورة ونص على الخريطة.

تلميح

ستقوم طبقات الرمز افتراضيا بعرض إحداثيات جميع الأشكال الهندسية في مصدر بيانات. لتقييد الطبقة بحيث لا تعرض سوى ميزات هندسة النقاط، اضبط filter خيار الطبقة على NSPredicate(format: "%@ == \"Point\"", NSExpression.geometryTypeAZMVariable). إذا كنت ترغب في تضمين ميزات MultiPoint أيضا ، فاستخدم NSCompoundPredicate.

المتطلبات الأساسية

تأكد من إكمال الخطوات الواردة في التشغيل السريع: إنشاء مستند تطبيق iOS . يمكن إدراج كتل التعليمات البرمجية في هذه المقالة في viewDidLoad وظيفة ViewController.

إضافة طبقة رمز

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

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

//Create a data source and add it to the map.
let source = DataSource()
map.sources.add(source)

//Create a point and add it to the data source.
source.add(geometry: Point(CLLocationCoordinate2D(latitude: 0, longitude: 0)))

//Create a symbol layer to render icons and/or text at points on the map.
let layer = SymbolLayer(source: source)

//Add the layer to the map.
map.layers.addLayer(layer)

هناك ثلاثة أنواع مختلفة من البيانات النقطية التي يمكن إضافتها إلى الخريطة:

هندسة GeoJSON Point - يحتوي هذا الكائن فقط على إحداثيات نقطة ولا شيء آخر. Point يمكن استخدام طريقة init لإنشاء هذه الكائنات بسهولة.
هندسة GeoJSON MultiPoint - يحتوي هذا الكائن على إحداثيات نقاط متعددة ولا شيء آخر. تمرير صفيف من الإحداثيات إلى PointCollection الفئة لإنشاء هذه الكائنات.
ميزة GeoJSON - يتكون هذا الكائن من أي هندسة GeoJSON ومجموعة من الخصائص التي تحتوي على بيانات تعريف مرتبطة بالهندسة.

لمزيد من المعلومات، راجع مستند إنشاء مصدر بيانات حول إنشاء البيانات وإضافتها إلى الخريطة.

ينشئ نموذج التعليمات البرمجية التالي هندسة GeoJSON Point ويمررها إلى ميزة GeoJSON وله قيمة مضافة title إلى خصائصه. title يتم عرض الخاصية كنص أسفل رمز الرمز على الخريطة.

// Create a data source and add it to the map.
let source = DataSource()
map.sources.add(source)

// Create a point feature.
let feature = Feature(Point(CLLocationCoordinate2D(latitude: 0, longitude: 0)))

// Add a property to the feature.
feature.addProperty("title", value: "Hello World!")

// Add the feature to the data source.
source.add(feature: feature)

// Create a symbol layer to render icons and/or text at points on the map.
let layer = SymbolLayer(
    source: source,
    options: [
        // Get the title property of the feature and display it on the map.
        .textField(from: NSExpression(forKeyPath: "title")),

        // Place the text below so it doesn't overlap the icon.
        .textAnchor(.top)
    ]
)

// Add the layer to the map.
map.layers.addLayer(layer)

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

Screenshot showing the zoom control that has been added to map.

تلميح

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

إضافة أيقونة مخصصة إلى طبقة رمز

يتم تقديم طبقات الرموز باستخدام OpenGL. على هذا النحو ، يجب تحميل جميع الموارد ، مثل صور الرموز ، في سياق OpenGL. يوضح هذا النموذج كيفية إضافة رمز مخصص إلى موارد الخريطة. ثم يتم استخدام هذا الرمز لعرض البيانات النقطية برمز مخصص على الخريطة. textField تتطلب خاصية طبقة الرمز تحديد تعبير. في هذه الحالة ، نريد عرض خاصية درجة الحرارة. بالإضافة إلى ذلك ، نريد أن نلحق "°F" به. يمكن استخدام تعبير للقيام بهذا التسلسل:

NSExpression(
    forAZMFunctionJoin: [
        NSExpression(forKeyPath: "temperature"),
        NSExpression(forConstantValue: "°F")
    ]
)

// Load a custom icon image into the image sprite of the map.
map.images.add(UIImage(named: "showers")!, withID: "my-custom-icon")

// Create a data source and add it to the map.
let source = DataSource()
map.sources.add(source)

// Create a point feature.
let feature = Feature(Point(CLLocationCoordinate2D(latitude: 40.75773, longitude: -73.985708)))

// Add a property to the feature.
feature.addProperty("temperature", value: 64)

// Add the feature to the data source.
source.add(feature: feature)

// Create a symbol layer to render icons and/or text at points on the map.
let layer = SymbolLayer(
    source: source,
    options: [
        .iconImage("my-custom-icon"),
        .iconSize(0.5),
        // Get the title property of the feature and display it on the map.
        .textField(
            from: NSExpression(
                forAZMFunctionJoin: [
                    NSExpression(forKeyPath: "temperature"),
                    NSExpression(forConstantValue: "°F")
                ]
            )
        ),
        .textOffset(CGVector(dx: 0, dy: -1.5))
    ]
)

// Add the layer to the map.
map.layers.addLayer(layer)

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


showers.png

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

Screenshot showing a Map with points rendered, using a symbol layer displaying a custom icon and a formatted text label for a point feature.

تلميح

عندما تريد عرض نص فقط بطبقة رمز، يمكنك إخفاء الأيقونة عن طريق تعيين iconImage خاصية خيارات الأيقونة على nil.

أيقونات علامة الرمز المحددة مسبقا

في البداية تحتوي الخريطة على رمز العلامة الافتراضي المدمج ، والذي تم تحميله بالفعل في عفريت الصورة للخريطة. سيتم استخدامه افتراضيا إذا لم يتم تعيين أي شيء على الخيار iconImage . في حال كنت بحاجة إلى القيام بذلك يدويا ، فقم بتعيينه "marker-default" على الخيار iconImage .

let layer = SymbolLayer(source: source, options: [.iconImage("marker-default")])

أيضا ، يأتي خرائط Azure iOS SDK مع مجموعة من اختلافات الألوان المحددة مسبقا لرمز العلامة الافتراضي (الأزرق الداكن). للوصول إلى أيقونات العلامات هذه، استخدم المتغيرات الثابتة في الفئة، على UIImage سبيل المثال: UIImage.azm_markerRed.

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

// Load a non-default predefined icon into the image sprite of the map.
map.images.add(.azm_markerRed, withID: "marker-red")

// Create a symbol layer to render icons and/or text at points on the map.
let layer = SymbolLayer(source: source, options: [.iconImage("marker-red")])

يسرد الرمز أدناه جميع صور الرموز المضمنة المتوفرة كمتغيرات ثابتة للفئة UIImage .

UIImage.azm_markerDefault // Dark blue
UIImage.azm_markerBlack
UIImage.azm_markerBlue
UIImage.azm_markerRed
UIImage.azm_markerYellow

معلومات إضافية

راجع المقالات التالية للحصول على مزيد من نماذج التعليمات البرمجية لإضافتها إلى خرائطك:

إضافة طبقة رموز في iOS SDK (معاينة)

هل هذه الصفحة مفيدة؟

المتطلبات الأساسية

إضافة طبقة رمز

إضافة أيقونة مخصصة إلى طبقة رمز

أيقونات علامة الرمز المحددة مسبقا

معلومات إضافية