useGeolocation

Installation

npm install @1hook/use-geolocation

Usage

import { useGeolocation } from '@1hook/use-geolocation'

When mounted, this hook begins tracking the user's location.
If location permissions haven't been granted yet, the browser will request permission from the user.

function LocationDisplay() {
  const { coords, state, error } = useGeolocation()

  if (state === 'loading') {
    return <div>Loading location...</div>
  }

  if (state === 'error') {
    return <div>Error: {error.message}</div>
  }

  return (
    <div>
      <div>Latitude: {coords.latitude}</div>
      <div>Longitude: {coords.longitude}</div>
    </div>
  )
}

API Reference

UseGeolocationOptions

Options for the useGeolocation hook. See MDN docs for more details.

Prop	Type	Default
`maximumAge?`	`number`	-
`timeout?`	`number`	-
`enableHighAccuracy?`	`boolean`	-

UseGeolocationReturn

The return value of the useGeolocation hook.

Prop	Type	Default
`coords`	`GeolocationCoordinates & { timestamp: number \| null }`	-
`error`	`GeolocationPositionError \| null`	-
`state`	`"loading" \| "watching" \| "error"`	-