Svelte Maplibre

API / Sources

GeoJSON

Add a GeoJSON source to the map. data can be a GeoJSON object or a URL.

Place layer components inside this component's children and they use this source automatically. The children render only after the source is added. When data changes, the component calls setData on the source.

Set cluster to group nearby points into clusters. Changes to cluster.maxZoom and cluster.radius apply to the existing source. Most other props are applied only when the source is created. If id changes, the component creates a new source.

import { GeoJSON } from 'svelte-maplibre';

Examples

Props

  • id string

    Default: getId('geojson')

  • data required GeoJSONType | string
  • generateId boolean

    Default: false

    Generate a unique id for each feature. This will overwrite existing IDs.

  • promoteId string

    Use this property on the feature as the ID. This will overwrite existing IDs.

  • filter ExpressionSpecification
  • lineMetrics boolean

    True to calculate line lengths. Required to use a line layer that uses the "line-gradient" paint property.

  • cluster ClusterOptions
  • maxzoom number
  • attribution string
  • buffer number
  • tolerance number
  • children Snippet

Source: src/lib/GeoJSON.svelte