---
title: "Interactive Web Maps with leaflet"
description: "Use jpmap boundary data in Leaflet, Quarto, pkgdown, and Shiny-style web maps."
output: rmarkdown::html_vignette
vignette: >
  %\VignetteIndexEntry{Interactive Web Maps with leaflet}
  %\VignetteEngine{knitr::rmarkdown}
  %\VignetteEncoding{UTF-8}
---

```{r, include = FALSE}
knitr::opts_chunk$set(
  collapse = TRUE,
  comment = "#>",
  message = FALSE,
  eval = FALSE,
  fig.width = 7,
  fig.height = 5
)
jpmap_build_full_vignettes <- identical(tolower(Sys.getenv("JPMAP_FULL_VIGNETTES")), "true") ||
  identical(tolower(Sys.getenv("IN_PKGDOWN")), "true")
jpmap_available_data <- if (jpmap_build_full_vignettes) {
  jpmap::available_jpmap_data()
} else {
  jpmap::available_jpmap_data(data_dir = tempfile())
}
jpmap_has_boundary_data <- nrow(jpmap_available_data) > 0
jpmap_has_okinawa_data <- any(jpmap_available_data$year == 2024 & jpmap_available_data$pref_code == "47")
jpmap_has_leaflet <- requireNamespace("leaflet", quietly = TRUE)
```

`plot_jpmap()` is the right tool for static maps with Okinawa and Ogasawara
insets. Leaflet is different: web tiles expect true longitude and latitude, so
`jp_map_leaflet()` uses literal WGS84 geography rather than the inset layout.

Install `leaflet` before running these examples:

```{r, eval = FALSE}
install.packages("leaflet")
```

## Prefecture Choropleth

```{r leaflet-prefecture, eval = jpmap_has_boundary_data && jpmap_has_leaflet}
library(tidyverse)
library(jpmap)

gdp <- jp_prefecture_gdp |>
  select(pref_code, prefecture, gdp_per_capita_jpy)

jp_map_leaflet(
  "prefecture",
  data = gdp,
  values = "gdp_per_capita_jpy",
  palette = "Blues",
  popup = "prefecture",
  simplify_tolerance = 0.03
)
```

`jp_map_leaflet()` uses the same data-join logic as `plot_jpmap()`. If your
data has numeric prefecture codes such as `1`, `2`, and `47`, `jpmap` can still
match them to map codes such as `"01"`, `"02"`, and `"47"`.

## Disputed-Territory Layer

For web maps, use `territorial_disputes = FALSE` to exclude
disputed-territory shapes, or highlight them explicitly.

```{r, eval = FALSE}
jp_map_leaflet(
  "prefecture",
  fill = "grey92",
  disputed_fill = "#005BAC",
  disputed_color = "#001040",
  disputed_dots = TRUE
)
```

Small disputed-territory polygons can be hard to click at a national zoom
level, so `disputed_dots = TRUE` can add circle markers when you choose to
emphasize them.

## Municipal Map

Okinawa municipal data can be used when the corresponding boundary file is
available through `jpmapdata` or `jpmap_data_dir()`.

```{r, eval = jpmap_has_okinawa_data && jpmap_has_leaflet}
jp_map_leaflet(
  "municipality",
  include = "Okinawa",
  fill = "grey92",
  color = "white",
  weight = 0.8,
  popup = "municipality_ja"
)
```

For other prefectures or nationwide municipal maps, build local MLIT N03 data
first with `jpmap_build_data()`.

## Quarto, pkgdown, And Shiny

Leaflet widgets returned by `jp_map_leaflet()` are ordinary htmlwidgets. You
can place them directly in Quarto documents, pkgdown articles, R Markdown
reports, and Shiny UI outputs.

For Shiny, build the widget inside `renderLeaflet()`:

```{r, eval = FALSE}
output$japan_map <- leaflet::renderLeaflet({
  jp_map_leaflet(
    "prefecture",
    data = jp_prefecture_gdp,
    values = "gdp_per_capita_jpy"
  )
})
```

Use `plot_jpmap()` when the map needs the compact inset layout. Use
`jp_map_leaflet()` when users need pan, zoom, labels, popups, and website
interaction.