Přidat vrstvu Heat mapy (Android SDK)

Heat mapy, označované také jako mapy hustoty bodů, jsou typem vizualizace dat. Slouží k reprezentaci hustoty dat pomocí rozsahu barev a zobrazení dat "aktivních bodů" na mapě. Heat mapy představují skvělý způsob vykreslování datových sad s velkým počtem bodů.

Vykreslení desítky tisíc bodů, protože symboly mohou pokrývat většinu oblastí rozvržení. Tento případ nejspíš způsobí, že mnoho symbolů překrývá. Je obtížné získat lepší informace o datech. Vizualizace stejné datové sady jako Heat mapy však usnadňuje zobrazení hustoty a relativní hustoty jednotlivých datových bodů.

Můžete použít Heat mapy v mnoha různých scénářích, mezi které patří:

• Data o teplotě: poskytuje přibližné hodnoty pro to, co je teplota mezi dvěma datovými body.
• Data pro senzory hluku: ukazuje nejen intenzitu hluku, kde je senzor, ale může také poskytnout přehled o rozptylu v rámci určité vzdálenosti. Úroveň hluku v některém webu nemusí být vysoká. Pokud se oblast pokrytí hluku od více senzorů překrývá, je možné, že se tato překrývající oblast dostanou o vyšší úrovně hluku. V takovém případě by se překrytá oblast zobrazila v Heat mapě.
• GPS Trace: zahrnuje rychlost jako mapu s váženou výškou, kde je intenzita jednotlivých datových bodů založena na rychlosti. Tato funkce například poskytuje způsob, jak zjistit, kde bylo vozidlo urychleno.

Požadavky

Ujistěte se, že jste dokončili kroky v rychlém startu: vytvoření dokumentu aplikace pro Android . Bloky kódu v tomto článku lze vložit do onReady obslužné rutiny události Maps.

Přidání vrstvy heat mapy

Chcete-li vykreslit zdroj dat bodů jako Heat mapu, předejte zdroj dat do instance HeatMapLayer třídy a přidejte jej do mapy.

Následující ukázka kódu načte z minulého týdne zemětřeseníový informační kanál pro střední hodnotu a vykresluje je jako Heat mapa. Každý datový bod se vykreslí s poloměrem 10 pixelů na všech úrovních přiblížení. Aby bylo zajištěno lepší uživatelské prostředí, je Heat mapa pod vrstvou popisku, aby popisky zůstaly jasně viditelné. Data v této ukázce se nacházejí v programu sadě USGS zemětřesení nebezpečí. Tato ukázka načte data ze služby data ze sítě JSON z webu pomocí bloku kódu nástroje pro import dat, který je k dispozici v dokumentu vytvořit zdroj dat .

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

//Import the geojson data and add it to the data source.
source.importDataFromUrl("https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_week.geojson");

//Add data source to the map.
map.sources.add(source);

//Create a heat map layer.
HeatMapLayer layer = new HeatMapLayer(source,
  heatmapRadius(10f),
  heatmapOpacity(0.8f)
);

//Add the layer to the map, below the labels.
map.layers.add(layer, "labels");

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

//Import the geojson data and add it to the data source.
source.importDataFromUrl("https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_week.geojson")

//Add data source to the map.
map.sources.add(source)

//Create a heat map layer.
val layer = HeatMapLayer(
    source,
    heatmapRadius(10f),
    heatmapOpacity(0.8f)
)

//Add the layer to the map, below the labels.
map.layers.add(layer, "labels")

Následující snímek obrazovky ukazuje mapu načítající Heat mapu pomocí výše uvedeného kódu.

Přizpůsobení vrstvy Heat mapy

Předchozí příklad upravil Heat mapu nastavením možnosti poloměr a krytí. Vrstva Heat mapy nabízí několik možností přizpůsobení, včetně:

• heatmapRadius: Definuje poloměr pixelu, ve kterém se má vykreslovat každý datový bod. Poloměr můžete nastavit jako pevné číslo nebo jako výraz. Pomocí výrazu můžete škálovat poloměr na základě úrovně přiblížení a znázornit konzistentní prostorové oblasti na mapě (například poloměr poloměru 5 km).

• heatmapColor: Určuje, jak je Heat mapa barevně barevná. Barevný přechod je běžnou funkcí Heat mapy. Efekt můžete dosáhnout pomocí interpolate výrazu. Můžete také použít step výraz pro Colorizing Heat mapy a rozvrhnout hustotu vizuálně do rozsahů, které se podobají obrysu nebo rozvržení paprskového stylu. Tyto palety barev definují barvy z minima na maximální hodnotu hustoty.

  Hodnoty barvy pro Heat mapy se určují jako výraz na heatmapDensity hodnotu. Barva oblasti, kde nejsou definována žádná data na indexu 0 výrazu "interpolace" nebo výchozí barva výrazu "steped". Tuto hodnotu lze použít k definování barvy pozadí. Tato hodnota je často nastavená na transparentní nebo na černou, která je částečně průhledná.

  Tady jsou příklady barevných výrazů:

  Výraz barvy interpolace	Výraz se zvýrazněnou barvou
  interpolovat     lineární ();     heatmapDensity(),     stop (0; barva (Color. TRANSPARENT));     stop (0,01; Color (Color. purpurová));     stop (0.5; Color (parseColor ("#fb00fb")));     stop (1; Barva (parseColor ("#00c3ff"))) )`	Krok     heatmapDensity(),     Color (Color. TRANSPARENTed);     stop (0,01; Color (parseColor ("#000080")));     stop (0,25; Color (parseColor ("#000080")));     stop (0,5; barva (Color. zelená));     stop (0,5; barva (Color. YELLOW));     stop (1; Barva (Color. RED)) )

• heatmapOpacity: Určuje, jak je vrstva Heat mapy neprůhledná nebo průhledná.

• heatmapIntensity: Aplikuje násobitel na váhu každého datového bodu pro zvýšení celkové intenzity heatmapu. Způsobuje rozdíl v hmotnosti datových bodů, což usnadňuje vizualizaci.

• heatmapWeight: Ve výchozím nastavení mají všechny datové body váhu 1 a mají stejnou váhu. Možnost váhy funguje jako násobitel a můžete ji nastavit jako číslo nebo výraz. Pokud je číslo nastavené jako váha, je rovnocenným umístěním jednotlivých datových bodů na mapě dvakrát. Pokud je například váha 2 , pak je tato hustota dvojitá. Nastavení možnosti váhy na číslo vykreslí Heat mapu podobným způsobem, jak použít možnost intenzita.

  Pokud však použijete výraz, může být váha každého datového bodu založena na vlastnostech jednotlivých datových bodů. Předpokládejme například, že každý datový bod představuje objekt zemětřesení. Hodnota velikosti byla důležitou metrikou pro každý datový bod zemětřesení. K zemětřesení dochází po celou dobu, ale většina má nízkou velikost a nevšimla se. Pomocí hodnoty velikost ve výrazu přiřaďte váhu každému datovému bodu. Když použijete hodnotu velikost pro přiřazení váhy, získáte lepší reprezentaci významnosti zemětřesení v rámci Heat mapy.

• minZoom a maxZoom : rozsah úrovně přiblížení, kde má být vrstva zobrazena.

• filter: Filtrovací výraz použitý k omezení načítání ze zdroje a vykresleného ve vrstvě.

• sourceLayer: Pokud je zdroj dat připojený k vrstvě zdrojem vektorové dlaždice, je nutné zadat zdrojovou vrstvu v rámci vektorových dlaždic.

• visible: Skryje nebo zobrazí vrstvu.

Toto je příklad Heat mapy, kde se výraz liniové interpolace používá k vytvoření plynule barevného přechodu barvy. magVlastnost definovaná v datech se používá s exponenciální interpolací pro nastavení váhy nebo relevance jednotlivých datových bodů.

HeatMapLayer layer = new HeatMapLayer(source,
    heatmapRadius(10f),

    //A linear interpolation is used to create a smooth color gradient based on the heat map density.
    heatmapColor(
        interpolate(
            linear(),
            heatmapDensity(),
            stop(0, color(Color.TRANSPARENT)),
            stop(0.01, color(Color.BLACK)),
            stop(0.25, color(Color.MAGENTA)),
            stop(0.5, color(Color.RED)),
            stop(0.75, color(Color.YELLOW)),
            stop(1, color(Color.WHITE))
        )
    ),

    //Using an exponential interpolation since earthquake magnitudes are on an exponential scale.
    heatmapWeight(
       interpolate(
            exponential(2),
            get("mag"),
            stop(0,0),

            //Any earthquake above a magnitude of 6 will have a weight of 1
            stop(6, 1)
       )
    )
);

val layer = HeatMapLayer(source,
    heatmapRadius(10f),

    //A linear interpolation is used to create a smooth color gradient based on the heat map density.
    heatmapColor(
        interpolate(
            linear(),
            heatmapDensity(),
            stop(0, color(Color.TRANSPARENT)),
            stop(0.01, color(Color.BLACK)),
            stop(0.25, color(Color.MAGENTA)),
            stop(0.5, color(Color.RED)),
            stop(0.75, color(Color.YELLOW)),
            stop(1, color(Color.WHITE))
        )
    ),

    //Using an exponential interpolation since earthquake magnitudes are on an exponential scale.
    heatmapWeight(
       interpolate(
            exponential(2),
            get("mag"),
            stop(0,0),

            //Any earthquake above a magnitude of 6 will have a weight of 1
            stop(6, 1)
       )
    )
)

Následující snímek obrazovky ukazuje výše uvedenou vlastní vrstvu Heat mapy pomocí stejných dat z předchozího příkladu Heat mapy.

Konzistentní Heat mapa s přiblížením

Ve výchozím nastavení mají poloměry datových bodů vykreslených v vrstvě Heat mapy u všech úrovní přiblížení pevný obraz v pixelech. Při přiblížení mapy se data agreguje společně a vrstva Heat mapy vypadá jinak. Následující video ukazuje výchozí chování Heat mapy, kde při přiblížení mapy udržuje poloměr obrazového bodu.

Použijte zoom výraz pro horizontální navýšení kapacity poloměru pro každou úroveň přiblížení, takže každý datový bod pokrývá stejnou fyzickou oblast mapy. Tento výraz vytvoří vrstvu Heat mapy, která vypadá spolehlivě a je konzistentní. Každá úroveň přiblížení mapy má dvakrát a vodorovně tolik pixelů jako předchozí úroveň přiblížení.

Škálování poloměru tak, aby dvojnásobek každé úrovně přiblížení vytvoří Heat mapu, která vypadá konzistentně na všech úrovních přiblížení. Chcete-li použít toto škálování, použijte zoom se exponential interpolation výrazem základní 2 s poloměrem, který je nastavený pro minimální úroveň přiblížení, a s poloměrem na škálované poloměr pro maximální úroveň přiblížení, jak je 2 * Math.pow(2, minZoom - maxZoom) znázorněno v následující ukázce. Přiblížením mapy zjistíte, jak se Heat mapa škáluje s úrovní přiblížení.

HeatMapLayer layer = new HeatMapLayer(source,
  heatmapRadius(
    interpolate(
      exponential(2),
      zoom(),

      //For zoom level 1 set the radius to 2 pixels.
      stop(1, 2f),

      //Between zoom level 1 and 19, exponentially scale the radius from 2 pixels to 2 * (maxZoom - minZoom)^2 pixels.
      stop(19, Math.pow(2, 19 - 1) * 2f)
    )
  ),
  heatmapOpacity(0.75f)
);

val layer = HeatMapLayer(source,
  heatmapRadius(
    interpolate(
      exponential(2),
      zoom(),

      //For zoom level 1 set the radius to 2 pixels.
      stop(1, 2f),

      //Between zoom level 1 and 19, exponentially scale the radius from 2 pixels to 2 * (maxZoom - minZoom)^2 pixels.
      stop(19, Math.pow(2.0, 19 - 1.0) * 2f)
    )
  ),
  heatmapOpacity(0.75f)
)

Následující video ukazuje mapu s výše uvedeným kódem, který škáluje poloměr v době, kdy se mapa přiblíží, aby se vytvořilo konzistentní vykreslování Heat mapy napříč úrovněmi přiblížení.

zoomVýraz se dá použít jenom ve step interpolate výrazech a. Následující výraz lze použít k aproximaci poloměru v měřičích. Tento výraz používá zástupný symbol radiusMeters , který byste měli nahradit požadovaným poloměrem. Tento výraz vypočítá přibližný poloměr v pixelech pro úroveň přiblížení u objektu, který je na úrovni přiblížení a má hodnotu přiblížení 0 a 24, a používá exponential interpolation výraz pro horizontální navýšení těchto hodnot stejným způsobem, jakým systém dlaždic na mapě funguje.

interpolate(
    exponential(2),
    zoom(),
    stop(1, product(radiusMeters, 0.000012776039596366526)),
    stop(24, product(radiusMeters, 214.34637593279402))
)

HeatMapLayer layer = new HeatMapLayer(dataSource,
   heatmapWeight(get("point_count"))
);

interpolate(
    exponential(2),
    zoom(),
    stop(1, product(radiusMeters, 0.000012776039596366526)),
    stop(24, product(radiusMeters, 214.34637593279402))
)

var layer = new HeatMapLayer(dataSource,
   heatmapWeight(get("point_count"))
)

Další kroky

Další příklady kódu pro přidání do map najdete v následujících článcích: