Utilità mappa termica Google Maps per Android

Le mappe termiche sono utili per rappresentare la distribuzione e la densità dei dati punti su una mappa.

Introduzione

L'SDK Maps per Android La Utility Library include un'utilità per le mappe termiche, che puoi usare per aggiungerne una o più mappe termiche a una mappa Google nella tua applicazione.

Questo video illustra l'uso delle mappe termiche in alternativa agli indicatori, quando i dati richiedono un numero elevato di punti dati sulla mappa.

Con le mappe termiche tutto è più facile ai visualizzatori di comprendere la distribuzione e l'intensità relativa dei dati punti su una mappa. Anziché posizionare un indicatore in ogni luogo, le mappe termiche utilizzano per rappresentare la distribuzione dei dati.

Nell'esempio seguente, il rosso rappresenta le aree ad alta concentrazione di forze dell'ordine. stazione a Victoria, Australia.

Se non hai ancora configurato la libreria di utilità di Maps SDK for Android, segui la guida alla configurazione prima di leggere il resto di questa pagina.

Aggiungere una mappa termica semplice

Per aggiungere una mappa termica alla tua mappa, è necessario un set di dati composto da le coordinate di ogni luogo di interesse. Per prima cosa, crea un HeatmapTileProvider, passando la raccolta di LatLng oggetti. Quindi crea un nuovo TileOverlay, passare il riquadro della mappa termica al fornitore e aggiungere l'overlay alla mappa.

L'utilità fornisce la classe HeatmapTileProvider, che implementa TileProvider per fornire le immagini dei riquadri per la mappa termica. HeatmapTileProvider accetta una raccolta di LatLng (o WeightedLatLng come descritto di seguito). Crea il riquadro immagini per vari livelli di zoom, in base a raggio, gradiente e opacità le opzioni fornite. Puoi modifica i valori predefiniti di queste opzioni.

Diamo un'occhiata ai passaggi in modo più dettagliato:

1. Utilizza le funzionalità di HeatmapTileProvider.Builder(), passarle una raccolta di LatLng oggetti, per aggiungere un nuovo HeatmapTileProvider.
2. Crea un nuovo elemento TileOverlayOptions con le opzioni pertinenti, incluso HeatmapTileProvider.
3. Chiama GoogleMap.addTileOverlay() per aggiungere l'overlay alla mappa.

private fun addHeatMap() {
    var latLngs: List<LatLng?>? = null

    // Get the data: latitude/longitude positions of police stations.
    try {
        latLngs = readItems(R.raw.police_stations)
    } catch (e: JSONException) {
        Toast.makeText(context, "Problem reading list of locations.", Toast.LENGTH_LONG)
            .show()
    }

    // Create a heat map tile provider, passing it the latlngs of the police stations.
    val provider = HeatmapTileProvider.Builder()
        .data(latLngs)
        .build()

    // Add a tile overlay to the map, using the heat map tile provider.
    val overlay = map.addTileOverlay(TileOverlayOptions().tileProvider(provider))
}

@Throws(JSONException::class)
private fun readItems(@RawRes resource: Int): List<LatLng?> {
    val result: MutableList<LatLng?> = ArrayList()
    val inputStream = context.resources.openRawResource(resource)
    val json = Scanner(inputStream).useDelimiter("\\A").next()
    val array = JSONArray(json)
    for (i in 0 until array.length()) {
        val `object` = array.getJSONObject(i)
        val lat = `object`.getDouble("lat")
        val lng = `object`.getDouble("lng")
        result.add(LatLng(lat, lng))
    }
    return result
}

      

private void addHeatMap() {
    List<LatLng> latLngs = null;

    // Get the data: latitude/longitude positions of police stations.
    try {
        latLngs = readItems(R.raw.police_stations);
    } catch (JSONException e) {
        Toast.makeText(context, "Problem reading list of locations.", Toast.LENGTH_LONG).show();
    }

    // Create a heat map tile provider, passing it the latlngs of the police stations.
    HeatmapTileProvider provider = new HeatmapTileProvider.Builder()
        .data(latLngs)
        .build();

    // Add a tile overlay to the map, using the heat map tile provider.
    TileOverlay overlay = map.addTileOverlay(new TileOverlayOptions().tileProvider(provider));
}

private List<LatLng> readItems(@RawRes int resource) throws JSONException {
    List<LatLng> result = new ArrayList<>();
    InputStream inputStream = context.getResources().openRawResource(resource);
    String json = new Scanner(inputStream).useDelimiter("\\A").next();
    JSONArray array = new JSONArray(json);
    for (int i = 0; i < array.length(); i++) {
        JSONObject object = array.getJSONObject(i);
        double lat = object.getDouble("lat");
        double lng = object.getDouble("lng");
        result.add(new LatLng(lat, lng));
    }
    return result;
}

      

Per questo esempio, i dati vengono archiviati in un file JSON, police_stations.json. Ecco un estratto del file:

[
{"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 }
]

Utilizza punti di latitudine/longitudine ponderati

Quando crei un HeatmapTileProvider, puoi trasmetterlo raccolta di coordinate di latitudine/longitudine ponderate. È utile se vuoi illustrare l'importanza di un particolare insieme di località.

Per applicare la ponderazione a località specifiche:

1. Crea un nuovo elemento WeightedLatLng per ogni posizione che richiede la ponderazione. Supera il LatLng e double che rappresenta l'intensità richiesta. L'intensità indica l'importanza relativa, o valore, della località. Un determina un colore più intenso nel gradiente della mappa termica. Di predefinito, il colore a maggiore intensità è il rosso.

2. Chiama HeatmapTileProvider.Builder().weightedData(), anziché HeatmapTileProvider.Builder().data(), per creare mappa termica.

Personalizzare la mappa termica

Alcune proprietà della mappa termica sono personalizzabili. Puoi impostare opzioni al momento della creazione, tramite le funzioni Builder. In alternativa, puoi modificare un'opzione in qualsiasi momento chiamando il setter pertinente su HeatmapTileProvider, quindi cancella la cache di riquadri in modo da ridisegnare tutti i riquadri con le nuove opzioni.

Sono disponibili le seguenti opzioni:

1. Raggio: la dimensione della sfocatura gaussiana applicata alla mappa termica. espressi in pixel. Il valore predefinito è 20. Il valore deve essere compreso tra 10 e 50. Utilizza la radius() del builder per impostare il valore durante la creazione della mappa termica. o modifica il valore in un secondo momento con setRadius().
2. Gradiente: una gamma di colori utilizzati dalla mappa termica per generare la sua mappa a colori con intensità più bassa o più alta. Viene creato un gradiente utilizzando due array: un array intero contenente i colori e un array in virgola mobile che indica il punto di partenza per ogni colore, espresso come percentuale dello intensità massima ed espressa come frazione da 0 a 1. Devi specificare un solo colore per un gradiente monocolore o un minimo di due per un gradiente di più colori. La mappa colori viene generata utilizzando l'interpolazione tra questi colori. Il gradiente predefinito ha due colori. Utilizza le funzionalità di l'gradient() di Builder per impostare il valore durante la creazione mappa termica o modifica il valore in un secondo momento con setGradient().
3. Opacità: è l'opacità dell'intero livello della mappa termica. va da 0 a 1. Il valore predefinito è 0,7. Utilizza la finestra di dialogo opacity() per impostare il valore durante la creazione della mappa termica oppure modifica il valore in un secondo momento con setOpacity().

Ad esempio, crea un Gradient per impostare il gradiente prima di aggiungere la mappa termica:

// Create the gradient.
val colors = intArrayOf(
    Color.rgb(102, 225, 0),  // green
    Color.rgb(255, 0, 0) // red
)
val startPoints = floatArrayOf(0.2f, 1f)
val gradient = Gradient(colors, startPoints)

// Create the tile provider.
val provider = HeatmapTileProvider.Builder()
    .data(latLngs)
    .gradient(gradient)
    .build()

// Add the tile overlay to the map.
val tileOverlay = map.addTileOverlay(
    TileOverlayOptions()
        .tileProvider(provider)
)

      

// Create the gradient.
int[] colors = {
    Color.rgb(102, 225, 0), // green
    Color.rgb(255, 0, 0)    // red
};

float[] startPoints = {
    0.2f, 1f
};

Gradient gradient = new Gradient(colors, startPoints);

// Create the tile provider.
HeatmapTileProvider provider = new HeatmapTileProvider.Builder()
    .data(latLngs)
    .gradient(gradient)
    .build();

// Add the tile overlay to the map.
TileOverlay tileOverlay = map.addTileOverlay(new TileOverlayOptions().tileProvider(provider));

      

Per modificare l'opacità di una mappa termica esistente:

provider.setOpacity(0.7)
tileOverlay?.clearTileCache()

      

provider.setOpacity(0.7);
tileOverlay.clearTileCache();

      

Modifica il set di dati

Per cambiare il set di dati su cui viene creata una mappa termica, utilizza HeatmapTileProvider.setData(), o HeatmapTileProvider.setWeightedData() per WeightedLatLng punti. Nota: se vuoi aggiungere punti a la mappa termica o rimuovere punti dalla mappa termica, aggiornare la raccolta dei dati e poi usa setData() o setWeightedData().

val data: List<WeightedLatLng> = ArrayList()
provider.setWeightedData(data)
tileOverlay?.clearTileCache()

      

List<WeightedLatLng> data = new ArrayList<>();
provider.setWeightedData(data);
tileOverlay.clearTileCache();

      

Rimuovere una mappa termica

Per rimuovere la mappa termica, devi rimuovere l'overlay del riquadro:

tileOverlay?.remove()

      

tileOverlay.remove();

      

Guarda l'app demo

Per un altro esempio di implementazione di una mappa termica, dai un'occhiata alla HeatmapsDemoActivity nell'app demo che spedisce con la libreria di utilità. La guida alla configurazione ti mostra su come eseguire l'app demo.