افزودن نقشه قابل‌طراحی

پلاتفرم را انتخاب کنید: Android iOS JavaScript

این صفحه راهنمای سریعی برای سبک‌بندی نقشه‌تان است که از حالت شب به‌عنوان نمونه استفاده می‌کند.

نمای کلی

با گزینه‌های سبک می‌توانید ارائه سبک‌های استاندارد Google Map را سفارشی‌سازی کنید و نمایش بصری ویژگی‌هایی مانند جاده‌ها، پارک‌ها، کسب‌وکارها، و دیگر مکان‌های جالب را تغییر دهید. این یعنی می‌توانید بر مؤلفه‌های خاصی از نقشه تأکید کنید یا نقشه را مکمل سبک برنامه‌تان کنید.

سبک‌بندی فقط روی نوع نقشه kGMSTypeNormal کار می‌کند.

اعمال سبک‌ها بر نقشه

برای اعمال سبک‌های نقشه سفارشی به نقشه، GMSMapStyle(...) را فراخوانی کنید تا نمونه GMSMapStyle ایجاد شود، نشانی وب فایل JSON محلی یا رشته JSON حاوی تعاریف سبک را ارسال کنید. نمونه GMSMapStyle را به خصوصیت mapStyle نقشه اختصاص دهید.

استفاده از فایل JSON

مثال‌های زیر فراخوانی GMSMapStyle(...) و ارسال نشانی وب برای فایل محلی را نشان می‌دهد:

Swift

import GoogleMaps

class MapStyling: UIViewController {

  // Set the status bar style to complement night-mode.
  override var preferredStatusBarStyle: UIStatusBarStyle {
    return .lightContent
  }

  override func loadView() {
    let camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 14.0)
    let options = GMSMapViewOptions()
    options.camera = camera
    let mapView = GMSMapView(options: options)

    do {
      // Set the map style by passing the URL of the local file.
      if let styleURL = Bundle.main.url(forResource: "style", withExtension: "json") {
        mapView.mapStyle = try GMSMapStyle(contentsOfFileURL: styleURL)
      } else {
        NSLog("Unable to find style.json")
      }
    } catch {
      NSLog("One or more of the map styles failed to load. \(error)")
    }

    self.view = mapView
  }
}
      

آبجکتیو-سی

#import "MapStyling.h"
@import GoogleMaps;

@interface MapStyling ()

@end

@implementation MapStyling

// Set the status bar style to complement night-mode.
- (UIStatusBarStyle)preferredStatusBarStyle {
  return UIStatusBarStyleLightContent;
}

- (void)loadView {
  GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.86
                                                          longitude:151.20
                                                               zoom:12];
  GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
  options.camera = camera;
  GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];
  mapView.myLocationEnabled = YES;

  NSBundle *mainBundle = [NSBundle mainBundle];
  NSURL *styleUrl = [mainBundle URLForResource:@"style" withExtension:@"json"];
  NSError *error;

  // Set the map style by passing the URL for style.json.
  GMSMapStyle *style = [GMSMapStyle styleWithContentsOfFileURL:styleUrl error:&error];

  if (!style) {
    NSLog(@"The style definition could not be loaded: %@", error);
  }

  mapView.mapStyle = style;
  self.view = mapView;
}

@end
      

برای تعریف گزینه‌های سبک، فایل جدیدی با نام style.json به پروژه‌تان اضافه کنید، و برای سبک حالت شب، اعلان سبک JSON زیر را جای‌گذاری کنید:

استفاده از منبع رشته‌ای

مثال‌های زیر فراخوانی GMSMapStyle(...) و ارسال منبع رشته را نشان می‌دهد:

Swift

class MapStylingStringResource: UIViewController {

  let MapStyle = "JSON_STYLE_GOES_HERE"

  // Set the status bar style to complement night-mode.
  override var preferredStatusBarStyle: UIStatusBarStyle {
    return .lightContent
  }

  override func loadView() {
    let camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 14.0)
    let options = GMSMapViewOptions()
    options.camera = camera
    let mapView = GMSMapView(options: options)

    do {
      // Set the map style by passing a valid JSON string.
      mapView.mapStyle = try GMSMapStyle(jsonString: MapStyle)
    } catch {
      NSLog("One or more of the map styles failed to load. \(error)")
    }

    self.view = mapView
  }
}
      

آبجکتیو-سی

@implementation MapStylingStringResource

// Paste the JSON string to use.
static NSString *const kMapStyle = @"JSON_STYLE_GOES_HERE";

// Set the status bar style to complement night-mode.
- (UIStatusBarStyle)preferredStatusBarStyle {
  return UIStatusBarStyleLightContent;
}

- (void)loadView {
  GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.86
                                                          longitude:151.20
                                                               zoom:12];
  GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
  options.camera = camera;
  GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];
  mapView.myLocationEnabled = YES;

  NSError *error;

  // Set the map style by passing a valid JSON string.
  GMSMapStyle *style = [GMSMapStyle styleWithJSONString:kMapStyle error:&error];

  if (!style) {
    NSLog(@"The style definition could not be loaded: %@", error);
  }

  mapView.mapStyle = style;
  self.view = mapView;
}

@end
      

برای تعریف گزینه‌های سبک، رشته سبک زیر را به‌عنوان مقدار متغیر kMapStyle جای‌گذاری کنید:

اعلامیه‌های سبک JSON

نقشه‌های قابل‌طراحی از دو مفهوم برای اعمال رنگ‌ها و سایر تغییرات سبک در نقشه استفاده می‌کنند:

  • انتخابگرها مؤلفه‌های جغرافیایی را که می‌توانید در نقشه سبک‌بندی کنید مشخص می‌کنند. این عناصر شامل جاده‌ها، پارک‌ها، پهنه‌های آبی، و غیره، و همچنین برچسب‌های آن‌ها می‌شود. انتخاب‌کننده‌ها شامل ویژگی‌ها و عناصر هستند که به‌عنوان ویژگی‌های featureType و elementType مشخص شده‌اند.
  • سبک‌دهنده‌ها ویژگی‌های رنگ و نمایانی هستند که می‌توانید به عناصر نقشه اعمال کنید. آن‌ها رنگ نمایش‌داده‌شده را ازطریق ترکیبی از رنگ‌مایه، رنگ، و مقادیر روشنایی و گاما تعریف می‌کنند.

برای شرح مفصل گزینه‌های سبک‌بندی JSON، به مرجع سبک مراجعه کنید.

دستیار سبک‌بندی پلاتفرم Maps

از دستیار سبک‌بندی پلاتفرم Maps به‌عنوان روشی سریع برای تولید شیء سبک‌بندی JSON استفاده کنید. کیت توسعه نرم‌افزار Google Maps برای iOS از همان اعلان‌های سبک Maps JavaScript API پشتیبانی می‌کند.

نمونه‌های کد کامل

مخزن ApiDemos در GitHub شامل نمونه‌هایی است که استفاده از سبک‌بندی را نشان می‌دهد.

مرحله بعدی

ببینید چگونه می‌توانید با سبک‌بندی ویژگی‌ها را در نقشه پنهان کنید.