eurostat-map
    Preparing search index...

    Interface MapConfig

    Base configuration for all map types. Each specific map type will extend this with its own properties, but these are the common ones that apply to all maps.

    interface MapConfig {
        svgId?: string;
        containerId?: string;
        proj?: string;
        projectionFunction?: () => any;
        scale?: "60M" | "20M" | "10M" | "03M" | "01M";
        nutsLevel?: number | "mixed";
        nutsYear?: string | number;
        geoCenter?: [number, number];
        geo?: string;
        width?: number;
        height?: number;
        title?: string;
        subtitle?: string;
        footnote?: string;
        footnoteTooltipText?: string | false;
        footnoteWrap?: number | false;
        noDataText?: string;
        language?: string;
        transitionDuration?: number;
        stat?:
            | StatConfig
            | CompositionStatConfig<Record<string, Record<string, number>>>
            | Record<
                string,
                | StatConfig
                | CompositionStatConfig<Record<string, Record<string, number>>>,
            >;
        encoding?: Record<string, EncodingConfig>;
        legend?: false | LegendConfig;
        rankedBarChart?: false | RankedBarChartConfig;
        tooltip?: TooltipConfig;
        insets?: boolean | "image" | "default" | InsetConfig[] | "eu" | "euEfta";
        insetBoxPosition?: [number, number];
        insetBoxPadding?: number;
        insetBoxWidth?: number;
        insetScale?: string;
        insetZoomExtent?: [number, number];
        zoomExtent?: [number, number];
        translateExtent?: [[number, number], [number, number]];
        lockPanUntilZoom?: boolean;
        gridCartogramSettings?: Partial<GridCartogramSettings>;
        dorlingSettings?: Partial<DorlingSettings>;
        drawCoastalMargin?: boolean;
        coastalMarginSettings?: Partial<CoastalMarginSettings>;
        drawGraticule?: boolean;
        labels?: false | LabelsConfig;
        onBuild?: (map: MapInstance) => void;
        scalebar?: boolean | ScalebarConfig;
        annotations?: { annotations: any[]; editMode?: boolean };
        gridCartogram?: boolean;
        filterGeometriesFunction?: (geometry: any) => boolean;
        backgroundMap?: boolean;
        minimap?: MinimapConfig;
        stamp?: false | StampConfig;
        zoomButtons?: boolean;
        insetsButton?: boolean;
        legendButton?: boolean;
        placenames?: boolean;
        placenamesFilter?: (name: any) => boolean;
        header?: boolean;
        footer?: boolean;
        footerPadding?: number;
        headerPadding?: number;
        titlePosition?: [number, number];
        subtitlePosition?: [number, number];
        footnotePosition?: [number, number];
        showEstatLogo?: boolean;
        logoPosition?: [number, number];
        logoWidth?: number;
        logoHeight?: number;
        showEstatRibbon?: boolean;
        ribbonPosition?: [number, number];
        ribbonWidth?: number;
        ribbonHeight?: number;
        zoomButtonsPosition?: [number, number];
        insetsButtonPosition?: [number, number];
        insetsVisibilityBreakpoint?: number;
        legendButtonPosition?: [number, number];
        legendVisibilityBreakpoint?: number;
        hoverColor?: string;
        noDataFillStyle?: string;
        showSourceLink?: boolean;
        patternFill?: PatternFillConfig | PatternFillConfig[];
        [key: string]: any;
    }

    Hierarchy (View Summary)

    Indexable

    • [key: string]: any

      Allow additional properties for extensibility.

    Index

    Properties

    svgId? containerId? proj? projectionFunction? scale? nutsLevel? nutsYear? geoCenter? geo? width? height? title? subtitle? footnote? footnoteTooltipText? footnoteWrap? noDataText? language? transitionDuration? stat? encoding? legend? rankedBarChart? tooltip? insets? insetBoxPosition? insetBoxPadding? insetBoxWidth? insetScale? insetZoomExtent? zoomExtent? translateExtent? lockPanUntilZoom? gridCartogramSettings? dorlingSettings? drawCoastalMargin? coastalMarginSettings? drawGraticule? labels? onBuild? scalebar? annotations? gridCartogram? filterGeometriesFunction? backgroundMap? minimap? stamp? zoomButtons? insetsButton? legendButton? placenames? placenamesFilter? header? footer? footerPadding? headerPadding? titlePosition? subtitlePosition? footnotePosition? showEstatLogo? logoPosition? logoWidth? logoHeight? showEstatRibbon? ribbonPosition? ribbonWidth? ribbonHeight? zoomButtonsPosition? insetsButtonPosition? insetsVisibilityBreakpoint? legendButtonPosition? legendVisibilityBreakpoint? hoverColor? noDataFillStyle? showSourceLink? patternFill?

    Properties

    svgId?: string

    Container settings.

    containerId?: string

    ID of the container element used to host the map.

    proj?: string

    NUTS2json geometries projection: '3035', '3857', '4326'. For custom projections, use 4326 and then set projectionFunction().

    projectionFunction?: () => any

    Function to set a custom projection. See d3-geo projections for examples.

    scale?: "60M" | "20M" | "10M" | "03M" | "01M"

    Scale of the map, for NUTSjson geometries.

    nutsLevel?: number | "mixed"

    NUTS level (0, 1, 2, 3), or 'mixed' to let each region use its most granular level.

    nutsYear?: string | number

    NUTS boundary year.

    geoCenter?: [number, number]

    Geographic center as [longitude, latitude].

    geo?: string

    NUTS2JSON geographic focus (e.g., 'EUR', 'WORLD', 'IC', 'GF'). See https://github.com/eurostat/Nuts2json#overseas-territories---map-insets

    width?: number

    Map dimensions.

    height?: number

    Map height in pixels.

    title?: string

    Map title.

    subtitle?: string

    Map subtitle.

    footnote?: string

    Footnote text shown below the map.

    footnoteTooltipText?: string | false

    Tooltip text shown when hovering over the footnote.

    footnoteWrap?: number | false

    Wrap footnote text at this many characters.

    noDataText?: string

    Text shown in the tooltip and legend for regions with no data.

    'No data available'
    language?: string

    BCP 47 language tag used when fetching labels from the Eurostat API.

    'en'
    transitionDuration?: number

    Duration in milliseconds for D3 transitions when the map updates. Set to 0 to disable.

    500
    stat?:
        | StatConfig
        | CompositionStatConfig<Record<string, Record<string, number>>>
        | Record<
            string,
            StatConfig
            | CompositionStatConfig<Record<string, Record<string, number>>>,
        >

    Statistical data configuration.

    Preferred for multi-dataset maps:

    • set named datasets via stat dictionary
    • bind channels via encoding
    encoding?: Record<string, EncodingConfig>

    Optional visual encoding configuration by channel (size, color, fill, composition, etc.).

    legend?: false | LegendConfig

    Legend configuration.

    rankedBarChart?: false | RankedBarChartConfig

    Ranked bar chart configuration (choropleth-classified map types only). Independent of the legend - has its own positioning and can render into an entirely different container/SVG to the legend's, rather than being a sub-feature of it.

    tooltip?: TooltipConfig

    Tooltip configuration.

    insets?: boolean | "image" | "default" | InsetConfig[] | "eu" | "euEfta"

    Inset map configurations. Pass a named preset string, or a custom array, or false to disable. Passing true is an alias for 'default'.

    • 'default': simple grid layout of overseas territories.
    • 'image': Malta, Liechtenstein and EU/EFTA overseas/remote territories, hand-tuned layout with connecting decoration (background box, separator lines, blur gradients).
    • 'eu': simple grid layout of EU overseas/outermost territories, no decoration.
    • 'euEfta': like 'eu', plus Liechtenstein and Svalbard, no decoration.
    insetBoxPosition?: [number, number]

    Position [x, y] of the box containing the default/named-preset insets layout.

    insetBoxPadding?: number

    Padding in pixels around/between insets in the default insets box layout.

    5
    insetBoxWidth?: number

    Width in pixels of each inset in the default insets box layout.

    210
    insetScale?: string

    Default NUTS2JSON scale used for insets that don't specify their own.

    '03M'
    insetZoomExtent?: [number, number]

    Default D3 zoom scale extent for insets. null disables zoom on insets.

    zoomExtent?: [number, number]

    Zoom and pan settings.

    translateExtent?: [[number, number], [number, number]]

    D3 zoom translate extent (pan boundaries), as [[x0, y0], [x1, y1]].

    lockPanUntilZoom?: boolean

    If true, panning is disabled until the user has zoomed at least once.

    true
    gridCartogramSettings?: Partial<GridCartogramSettings>

    Grid cartogram layout settings.

    dorlingSettings?: Partial<DorlingSettings>

    Dorling simulation settings.

    drawCoastalMargin?: boolean

    Show or hide the coastal margin effect.

    coastalMarginSettings?: Partial<CoastalMarginSettings>

    Coastal margin settings to override defaults.

    drawGraticule?: boolean

    Graticule.

    labels?: false | LabelsConfig

    Get or set label configuration for country names, statistical values, etc.

    map.labels({ values: true, backgrounds: true, backgroundFill: '#B19122' })
    onBuild?: (map: MapInstance) => void

    Fires once the map is built.

    scalebar?: boolean | ScalebarConfig

    Scalebar configuration. Can be boolean or configuration object.

    annotations?: { annotations: any[]; editMode?: boolean }

    Annotation configuration, rendered via the d3-svg-annotation library. annotations is an array of d3-svg-annotation annotation objects; each object's type may be one of 'annotationLabel' (default), 'annotationCallout', 'annotationCalloutRect', 'annotationCalloutCircle', 'annotationXYThreshold', resolved to the matching d3-svg-annotation function internally.

    gridCartogram?: boolean

    Grid cartogram enabled or disabled.

    filterGeometriesFunction?: (geometry: any) => boolean

    Custom geometry filtering function.

    backgroundMap?: boolean

    Toggle background map rendering (sea, country boundaries, etc.).

    minimap?: MinimapConfig

    Minimap (globe inset showing current viewport) configuration.

    stamp?: false | StampConfig

    Stamp/watermark annotation.

    { x: 10, y: 10, text: 'DRAFT', size: 40 }
    zoomButtons?: boolean

    Show/hide zoom +/- buttons.

    insetsButton?: boolean

    Show/hide inset map toggle button. When true and no insets are configured, the map automatically uses insets('default').

    legendButton?: boolean

    Show/hide legend toggle button.

    placenames?: boolean

    Show/hide placename labels.

    placenamesFilter?: (name: any) => boolean

    Filter function for placename labels.

    header?: boolean

    Use a separate header section for titles.

    footer?: boolean

    Use a separate footer section for footnotes.

    footerPadding?: number

    Padding between the map and footer in pixels.

    headerPadding?: number

    Padding between the header and map in pixels.

    titlePosition?: [number, number]

    Position adjustment for map title: [x, y]

    subtitlePosition?: [number, number]

    Position adjustment for map subtitle: [x, y]

    footnotePosition?: [number, number]

    Position adjustment for footnote text: [x, y]

    showEstatLogo?: boolean

    Show the Eurostat logo.

    logoPosition?: [number, number]

    Position adjustment for Eurostat logo: [x, y]

    logoWidth?: number

    Width in pixels of the Eurostat logo.

    200
    logoHeight?: number

    Height in pixels of the Eurostat logo.

    40
    showEstatRibbon?: boolean

    Show the Eurostat ribbon banner.

    ribbonPosition?: [number, number]

    Position adjustment for ribbon banner: [x, y]

    ribbonWidth?: number

    Width in pixels of the Eurostat ribbon banner.

    200
    ribbonHeight?: number

    Height in pixels of the Eurostat ribbon banner.

    40
    zoomButtonsPosition?: [number, number]

    Position adjustment for zoom buttons: [x, y]

    insetsButtonPosition?: [number, number]

    Position adjustment for insets button: [x, y]

    insetsVisibilityBreakpoint?: number

    Viewport width (px) at/below which insets start hidden (behind the insets button) unless insetsButton was set explicitly.

    768
    legendButtonPosition?: [number, number]

    Position adjustment for legend button: [x, y]

    legendVisibilityBreakpoint?: number

    Viewport width (px) at/below which the legend starts hidden (behind the legend button) when legendButton is enabled.

    768
    hoverColor?: string

    Pointer hover color for NUTS regions.

    noDataFillStyle?: string

    Base fill color for regions with no statistical data.

    showSourceLink?: boolean

    Show the link to the remote Eurostat statistical dataset.

    patternFill?: PatternFillConfig | PatternFillConfig[]

    Pattern fill (hatching/dots/crosshatch) overlays for specific regions.

    Settings

    Member Visibility

    On This Page

    Properties
    svgIdcontainerIdprojprojectionFunctionscalenutsLevelnutsYeargeoCentergeowidthheighttitlesubtitlefootnotefootnoteTooltipTextfootnoteWrapnoDataTextlanguagetransitionDurationstatencodinglegendrankedBarCharttooltipinsetsinsetBoxPositioninsetBoxPaddinginsetBoxWidthinsetScaleinsetZoomExtentzoomExtenttranslateExtentlockPanUntilZoomgridCartogramSettingsdorlingSettingsdrawCoastalMargincoastalMarginSettingsdrawGraticulelabelsonBuildscalebarannotationsgridCartogramfilterGeometriesFunctionbackgroundMapminimapstampzoomButtonsinsetsButtonlegendButtonplacenamesplacenamesFilterheaderfooterfooterPaddingheaderPaddingtitlePositionsubtitlePositionfootnotePositionshowEstatLogologoPositionlogoWidthlogoHeightshowEstatRibbonribbonPositionribbonWidthribbonHeightzoomButtonsPositioninsetsButtonPositioninsetsVisibilityBreakpointlegendButtonPositionlegendVisibilityBreakpointhoverColornoDataFillStyleshowSourceLinkpatternFill