نقشه‌های حرارتی

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

این ویدیو درباره استفاده از نقشه‌های حرارتی به‌عنوان جایگزینی برای نشانگرها بحث می‌کند، زمانی که داده‌های شما به تعداد زیادی نقطه داده روی نقشه نیاز دارد.

نقشه‌های حرارتی به بینندگان کمک می‌کنند تا توزیع و شدت نسبی نقاط داده را به‌راحتی روی نقشه درک کنند. نقشه‌های حرارتی به‌جای قرار دادن نشانگر در هر مکان، از رنگ برای نشان دادن توزیع داده‌ها استفاده می‌کنند.

در مثال زیر، رنگ قرمز نشان‌دهنده مناطقی با تراکم بالای ایستگاه‌های پلیس در ویکتوریا، استرالیا است.

اگر هنوز کتابخانه را راه‌اندازی نکرده‌اید، قبل‌از خواندن ادامه این صفحه، راهنمای راه‌اندازی را دنبال کنید.

افزودن نقشه حرارتی ساده

برای افزودن نقشه حرارتی به نقشه‌تان، به مجموعه داده‌ای متشکل از مختصات هر مکان موردعلاقه نیاز دارید. ابتدا، یک نمونه GMUHeatmapTileLayer ایجاد کنید و ویژگی map را روی GMSMapView تنظیم کنید. این کار را در تابع viewDidLoad() برنامه‌تان انجام دهید تا مطمئن شوید نقشه مبنا قبل‌از کار با نقشه حرارتی بار شده است. سپس مجموعه‌ای از اشیای GMUWeightedLatLng را به نمونه GMUHeatmapTileLayer ارسال کنید.

این ابزار کلاس GMUHeatmapTileLayer را ارائه می‌دهد که مجموعه‌ای از اشیاء GMUWeightedLatLng را می‌پذیرد. این کلاس تصاویر کاشی را برای سطوح بزرگ‌نمایی مختلف براساس گزینه‌های شعاع، گرادیان، و ماتی ارائه‌شده ایجاد می‌کند.

بررسی مراحل با جزئیات بیشتر:

1. نمونه GMUHeatmapTileLayer ایجاد کنید و ویژگی map را روی GMSMapView تنظیم کنید (این کار را در تابع viewDidLoad() برنامه‌تان انجام دهید).
2. مجموعه‌ای از اشیای GMUWeightedLatLng را به نمونه GMUHeatmapTileLayer منتقل کنید.
3. با GMUHeatmapTileLayer.map تماس بگیرید، نمای نقشه را رد کنید.

   Swift

   class Heatmap: UIViewController {
   
     private var mapView: GMSMapView!
     private var heatmapLayer: GMUHeatmapTileLayer!
   
     override func viewDidLoad() {
       super.viewDidLoad()
       heatmapLayer = GMUHeatmapTileLayer()
       heatmapLayer.map = mapView
     }
   
     // ...
   
     func addHeatmap() {
   
       // Get the data: latitude/longitude positions of police stations.
       guard let path = Bundle.main.url(forResource: "police_stations", withExtension: "json") else {
         return
       }
       guard let data = try? Data(contentsOf: path) else {
         return
       }
       guard let json = try? JSONSerialization.jsonObject(with: data, options: []) else {
         return
       }
       guard let object = json as? [[String: Any]] else {
         print("Could not read the JSON.")
         return
       }
   
       var list = [GMUWeightedLatLng]()
       for item in object {
         let lat = item["lat"] as! CLLocationDegrees
         let lng = item["lng"] as! CLLocationDegrees
         let coords = GMUWeightedLatLng(
           coordinate: CLLocationCoordinate2DMake(lat, lng),
           intensity: 1.0
         )
         list.append(coords)
       }
   
       // Add the latlngs to the heatmap layer.
       heatmapLayer.weightedData = list
     }
   }
         

   آبجکتیو-سی

   @implementation Heatmap {
     GMSMapView *_mapView;
     GMUHeatmapTileLayer *_heatmapLayer;
   }
   
   - (void)viewDidLoad {
     [super viewDidLoad];
     _heatmapLayer = [[GMUHeatmapTileLayer alloc] init];
     _heatmapLayer.map = _mapView;
   }
   
   // ...
   
   - (void) addHeatmap {
   
     // Get the data: latitude/longitude positions of police stations.
     NSURL *path = [NSBundle.mainBundle URLForResource:@"police_stations" withExtension:@"json"];
     NSData *data = [NSData dataWithContentsOfURL:path];
     NSArray *json = [NSJSONSerialization JSONObjectWithData:data options:0 error:nil];
   
     NSMutableArray<GMUWeightedLatLng *> *list = [[NSMutableArray alloc] init];
     [json enumerateObjectsUsingBlock:^(id  _Nonnull obj, NSUInteger idx, BOOL * _Nonnull stop) {
       NSDictionary *item = (NSDictionary *)obj;
       CLLocationDegrees lat = [(NSNumber *) [item valueForKey:@"lat"] doubleValue];
       CLLocationDegrees lng = [(NSNumber *) [item valueForKey:@"lng"] doubleValue];
       GMUWeightedLatLng *coords = [[GMUWeightedLatLng alloc] initWithCoordinate:CLLocationCoordinate2DMake(lat, lng)
                                                                       intensity:1.0];
       [list addObject:coords];
     }];
   
   
     // Add the latlngs to the heatmap layer.
     _heatmapLayer.weightedData = list;
   }
   @end
         

برای این مثال، داده‌ها در فایل JSON، police_stations.json ذخیره شده است. این هم گزیده‌ای از فایل:

[
{"lat" : -37.1886, "lng" : 145.708 } ,
{"lat" : -37.8361, "lng" : 144.845 } ,
{"lat" : -38.4034, "lng" : 144.192 } ,
{"lat" : -38.7597, "lng" : 143.67 } ,
{"lat" : -36.9672, "lng" : 141.083 }
]

درحال سفارشی‌سازی نقشه حرارتی

نقشه حرارتی چندین ویژگی سفارشی‌سازی‌شدنی دارد. می‌توانید گزینه‌ها را هنگام ایجاد اولیه نمونه GMUHeatmapTileLayer یا هرزمان با تنظیم مقدار جدیدی برای گزینه تنظیم کنید.

گزینه‌های زیر دردسترس است:

1. شعاع: اندازه محوشدگی گاوسی اعمال‌شده بر نقشه حرارتی، که برحسب پیکسل بیان می‌شود. پیش‌فرض ۲۰ است. باید بین ۱۰ تا ۵۰ باشد. از GMUHeatmapTileLayer.radius برای تنظیم شعاع استفاده کنید.

2. گرادیان: طیفی از رنگ‌ها که نقشه حرارتی برای تولید نقشه رنگی خود استفاده می‌کند، از کمترین تا بیشترین شدت. GMUGradient بااستفاده از آرایه عدد صحیح حاوی رنگ‌ها و آرایه شناور نشان‌دهنده نقطه شروع هر رنگ (که به‌صورت درصدی از حداکثر شدت و به‌صورت کسری از ۰ تا ۱ بیان می‌شود) ایجاد می‌شود. برای گرادیان تک‌رنگ باید فقط یک رنگ، و برای گرادیان چندرنگ باید حداقل دو رنگ مشخص کنید. نقشه رنگ بااستفاده از درون‌یابی بین آن رنگ‌ها تولید می‌شود. شیب پیش‌فرض دو رنگ دارد. پارامتر colorMapSize تعداد مراحل را در گرادیان تعریف می‌کند. اعداد بزرگ‌تر منجر به گرادیان هموارتری می‌شود، درحالی‌که اعداد کوچک‌تر انتقال‌های تیزتری شبیه به نمودار کانتور ایجاد می‌کنند. از GMUHeatmapTileLayer.gradient برای تنظیم گرادیان استفاده کنید.

3. ماتی: این ماتی کل لایه نقشه حرارتی است و محدوده‌ای بین ۰ تا ۱ دارد. پیش‌فرض ۰٫۷ است. از GMUHeatmapTileLayer.opacity برای تنظیم مقدار کدری استفاده کنید.

برای مثال، Gradient ایجاد کنید:

let gradientColors: [UIColor] = [.green, .red]
let gradientStartPoints: [NSNumber] = [0.2, 1.0]
heatmapLayer.gradient = GMUGradient(
  colors: gradientColors,
  startPoints: gradientStartPoints,
  colorMapSize: 256
)
      

NSArray<UIColor *> *gradientColors = @[UIColor.greenColor, UIColor.redColor];
NSArray<NSNumber *> *gradientStartPoints = @[@0.2, @1.0];
_heatmapLayer.gradient = [[GMUGradient alloc] initWithColors:gradientColors
                                                 startPoints:gradientStartPoints
                                                colorMapSize:256];
      

برای تغییر دادن ماتی نقشه حرارتی موجود:

heatmapLayer.opacity = 0.7
      

_heatmapLayer.opacity = 0.7;
      

به‌روزرسانی گزینه موجود

برای به‌روزرسانی گزینه‌ای که قبلاً تنظیم شده است، این مراحل را دنبال کنید:

1. گزینه را به مقدار موردنظر به‌روز کنید.
2. تماس با GMUHeatmapTileLayer.clearTileCache().

تغییر دادن مجموعه داده

برای تغییر مجموعه داده‌ای که نقشه حرارتی براساس آن ساخته شده است:

1. گردآوری داده‌هایتان را به‌روز کنید. از GMUHeatmapTileLayer.weightedData استفاده کنید و آرایه‌ای از GMUWeightedLatLng را ارسال کنید.
2. تماس با GMUHeatmapTileLayer.clearTileCache().

برداشتن نقشه حرارتی

برای برداشتن نقشه حرارتی، GMUHeatmapTileLayer.map را فراخوانی کنید و nil را ارسال کنید.

heatmapLayer.map = nil
      

_heatmapLayer.map = nil;
      

دیدن برنامه نمایشی

برای نمونه دیگری از پیاده‌سازی نقشه حرارتی، به HeatmapViewController در برنامه نمایشی که با کتابخانه ابزار ارائه می‌شود نگاه کنید. راهنمای راه‌اندازی به شما نشان می‌دهد که چگونه برنامه نمایشی را اجرا کنید.