MapGraticule

Renders graticule lines and optional outline as SVG <path> layers.
Outline is rendered only when background or border is provided.
The outline is drawn as two paths: fill under lines and border over lines

Props

Parameter	Type	Default	Description
background?	boolean | string	—	true renders background outline with no inline fill, string sets outline fill color
border?	boolean | string	—	true renders border outline with no inline stroke, string sets outline stroke color
config?	GraticuleConfig	—	See usage below
styles?	MapObject['styles']	—	Applies map-object interaction styles to the lines path

Use native SVG presentation attrs like stroke directly on MapGraticule lines.

Config

Use config to call graticule generator methods before rendering

{
  [methodName: string]: Arg | Arg[]
}

1. Single non-array value: Arg | [Arg] - pass directly or wrap with an array
2. Single array value: [Arg] - must be wrapped with an array
3. Multiple values: [Arg1, Arg2, ...]

See available methods in d3-geo graticule docs

Usage

<template>
  <MapBase :data="mapData">
    <MapFeatures fill="#f1f5f9" />
    <MapGraticule
      stroke="#94a3b8"
      background="#ffffff"
      border="#cbd5e1"
      :config="{
        step: [[15, 15]],
        precision: 2.5,
      }"
    />
  </MapBase>
</template>

Examples

• Graticule