熱視圖

本頁說明可在 utility 上使用的熱視圖公用程式 Maps SDK for 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
     }
   }
         

   Objective-C

   @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. 半徑：套用至熱視圖的高斯模糊效果範圍 (以 單位。預設值為 20)。此值必須介於 10 至 50 之間。使用 GMUHeatmapTileLayer.radius 可設定半徑。

2. 漸層：熱視圖用來產生顏色的範圍 地圖，範圍從最低到最高強度。GMUGradient 是透過以下方式建立： 包含色彩的整數陣列，以及指出 每個顏色的起點，以最大強度的百分比 並以 0 到 1 之間的分數表示您只需為 單色漸層，或多色的至少兩種顏色 漸層效果彩色地圖會使用這些顏色的內插類型來產生。 預設漸層有兩種顏色。colorMapSize 參數會定義 漸層的步數數字越大代表發生問題 這個數值則能產生較清晰的轉場效果，效果接近 等距圖形使用 GMUHeatmapTileLayer.gradient 設定漸層。

3. 不透明度：這是整個熱視圖圖層的不透明度，以及範圍 介於 0 到 1 之間預設值為 0.7。使用 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 。 設定指南會說明如何 執行試用版應用程式