# Route Profile

Perfil de terreno que se lê arrastando: a altitude e a rampa sob o cursor, e um clinômetro cuja agulha balança com a inclinação.

- Nome no registry: `route-profile`
- Tipo: componente
- Dependências npm: motion, react
- Demo: https://ui.visantlabs.com/c/route-profile
- Categorias: conteudo, rota, grafico, altitude, terreno, clinometro

## Quando usar

- Use quando: Mostrar uma rota, trilha ou prova pelo relevo, com leitura ponto a ponto
- Evite quando: Uma série de números sem terreno: streamgraph; só um nível, sem percurso: gauge

## Instalar

```bash
npx shadcn@latest add @visant/route-profile
```

## Usar

```tsx
<RouteProfile />
```

## API

### RouteProfile

Perfil de rota: leia o caminho pela forma do terreno, com um clinômetro que balança até a inclinação sob o cursor.

- `altitudes?: number[] = "Array.from({ length: 121 }, (_, i) => {
  const t = i / 120;
  return 620 + 1040 * (0.72 * Math.sin(Math.PI * t) ** 1.4 + (0.16 * (1 + Math.sin(t * 13))) / 2 + (0.1 * (1 + Math.sin(t * 29 + 1))) / 2);
})"` — As altitudes da rota, em metros, igualmente espaçadas.
- `defaultPosition?: number = 0.2` — Onde o cursor nasce, de 0 a 1.
- `distance?: number = 18` — Distância total, em km.
- `idle?: boolean = true` — Sozinho na tela, o cursor passeia até alguém pegar nele.
- `label?: string = "Posição na rota"` — Nome do controle para leitor de tela.
- `onPositionChange?: (position: number) => void`