HoloMap.Source.GeoJSON (HoloMap v0.1.0)

Copy Markdown View Source

GeoJSON features, given inline or fetched from a URL.

<HoloMap.Source.GeoJSON id="parcels" data={@feature_collection} />
<HoloMap.Source.GeoJSON id="stops" data="/api/stops.geojson" cluster cluster_radius={60} />

This is the source to reach for when the data comes from your own application. data is a plain Elixir map. Build it in a command, put it in state, and the map follows:

def command(:load_parcels, params, server) do
  put_action(server, :parcels_loaded, parcels: Repo.geojson(params.bbox))
end

def action(:parcels_loaded, params, component) do
  put_state(component, :parcels, params.parcels)
end

Changing data is the one source update that costs nothing structurally. MapLibre's setData swaps the features in place, leaving every layer built on top of it untouched.

Props

PropTypeNotes
idstringRequired. Referenced by layers' source prop
datamap or stringRequired. A GeoJSON object, or a URL to fetch one from
clusterbooleanGroup nearby points into clusters
cluster_radiusnumberCluster radius in pixels, default 50
cluster_max_zoomnumberZoom past which clustering stops
cluster_min_pointsnumberPoints needed to form a cluster
cluster_propertiesmapAggregations computed per cluster
max_zoomnumberMaximum zoom to tile the data at
buffernumberTile buffer in pixels
tolerancenumberDouglas-Peucker simplification tolerance
line_metricsbooleanRequired by line_gradient paint
generate_idbooleanAuto-assign feature ids, needed for feature state
promote_idstring or mapUse a property as the feature id instead
filterlistFilter applied before tiling
attributionstringAttribution text

Clustering

Clustered sources emit two kinds of feature, and they usually want two layers: one for clusters, one for the leftover single points.

<HoloMap.Source.GeoJSON id="stops" data={@stops} cluster cluster_radius={60} />

<HoloMap.Layer.Circle
  id="clusters"
  source="stops"
  filter={["has", "point_count"]}
  paint={%{circle_color: "#51bbd6", circle_radius: 18}}
/>

<HoloMap.Layer.Circle
  id="unclustered"
  source="stops"
  filter={["!", ["has", "point_count"]]}
  paint={%{circle_color: "#11b4da", circle_radius: 6}}
/>

Feature state

HoloMap.API.set_feature_state/3 needs every feature to have an id. GeoJSON features often do not carry one, so set generate_id or point promote_id at a property that is already unique.

Summary

Functions

Returns true to indicate that the callee module is a component module (has "use Hologram.Component" directive).

Returns the list of property definitions for the compiled component.

Functions

__is_hologram_component__()

@spec __is_hologram_component__() :: boolean()

Returns true to indicate that the callee module is a component module (has "use Hologram.Component" directive).

Examples

iex> __is_hologram_component__()
true

__props__()

@spec __props__() :: [{atom(), atom(), keyword()}]

Returns the list of property definitions for the compiled component.