250606.R.广州献血优待证景点标注

结果是交互式html文档

互动地图截图

原始数据

原始数据

R语言代码

# Sat Jun  7 14:39:58 2025 edit
# 字符编码：UTF-8
# R 版本：R 4.4.2 x64 for window 11
# cgh163email@163.com
# 个人笔记不负责任，拎了个梨🍐🍅
#.rs.restartR()
require(openxlsx)
rm(list = ls());gc()
library(leaflet)
require(leafletCN)
library(htmltools)



  dt <- read.xlsx("原始数据/工作簿2.xlsx")
gzmap <- sf::st_read('原始数据/gz.min.geojson')
plot(gzmap$geometry)
# 示例数据（含两个链接）
attractions <- data.frame(
  name = c("故宫", "外滩", "西湖", "长城"),
  lng = c(116.3974, 121.4902, 120.1551, 116.5704),
  lat = c(39.9183, 31.2397, 30.2741, 40.4319),
  url1 = c(
    "https://www.dpm.org.cn/",
    "https://www.trip.com/travel-guide/shanghai/the-bund-1401261/",
    "https://www.hangzhou.gov.cn/col/col1228980242/index.html",
    "https://www.thegreatwall.com.cn/"
  ),
  link_text1 = c("官网", "旅游攻略", "政务网", "官方网站"),
  url2 = c(
    "https://baike.baidu.com/item/%E5%8C%97%E4%BA%AC%E6%95%85%E5%AE%AB/127716",
    "https://baike.baidu.com/item/%E5%A4%96%E6%BB%A9/1696305",
    "https://baike.baidu.com/item/%E8%A5%BF%E6%B9%96/142748",
    "https://baike.baidu.com/item/%E4%B8%87%E9%87%8C%E9%95%BF%E5%9F%8E/1420"
  ),
  link_text2 = c("百度百科", "百度百科", "百度百科", "百度百科")
)
head(attractions)

# 创建地图
leaflet(attractions) |>
  addTiles() |>
  addMarkers(
    lng = ~lng,
    lat = ~lat,
    label = ~name,
    popup = ~paste0(
      "<div style='min-width:150px'>",
      "<b>", name, "</b><br><br>",
      "<span style='display: inline-block; margin-bottom: 5px;'>",
      "🔗 <a href='", url1, "' target='_blank' style='color: #0066cc;'>", link_text1, "</a>",
      "</span><br>",
      "<span style='display: inline-block;'>",
      "📚 <a href='", url2, "' target='_blank' style='color: #cc3300;'>", link_text2, "</a>",
      "</span>",
      "</div>"
    ),
    clusterOptions = markerClusterOptions()
  ) |>
  addControl(
    html = "<div style='padding:5px;background:white;border:1px solid gray;'>
            <b>点击标记查看双链接</b><br>
            <small>蓝色链接：官方资源 | 红色链接：百科资料</small>
            </div>",
    position = "topright"
  )
# Sat Jun  7 14:45:26 2025 ------------------------------
head(dt)
# name  lng lat urlinf  txt.inf urlamap txt.gps
# （温室也免）中国科学院华南植物园  113.364581  23.182387   https://mp.weixin.qq.com/s?__biz=MzUzMjkwMTU5Mw==&mid=2247486919&idx=2&sn=e5bd8a518107fb8cef25c4218a4d6c0f&scene=21#wechat_redirect 推文介绍    https://uri.amap.com/marker?position=113.364581,23.182387&name=（温室也免）中国科学院华南植物园&src=梨子定位&coordinate=gaode&callnative=1  高德地图
# 白江湖森林公园   113.896809  23.507591   https://mp.weixin.qq.com/s/H1509RbFM9zVk5-P6qGLSA   推文介绍    https://uri.amap.com/marker?position=113.896809,23.507591&name=白江湖森林公园&src=梨子定位&coordinate=gaode&callnative=1   高德地图

# Sat Jun  7 15:11:40 2025 +++++++++++++++++++

leaflet(dt) |>
  amap() |>
  addMarkers(
    lng = ~lng,
    lat = ~lat,
    label = ~name,
    popup = ~paste0(
      "<div style='min-width:150px'>",
      "<b>", name, "</b><br><br>",
      "<span style='display: inline-block; margin-bottom: 5px;'>",
      "🔗 <a href='", urlinf, "' target='_blank' style='color: #0066cc;'>", txt.inf, "</a>",
      "</span><br>",
      "<span style='display: inline-block;'>",
      "📚 <a href='", urlamap, "' target='_blank' style='color: #cc3300;'>", txt.gps, "</a>",
      "</span>",
      "</div>"
    ),
    clusterOptions = markerClusterOptions()
  )
# Sat Jun  7 15:52:33 2025 +++++++++++++++++++
# options = popupOptions(maxWidth = 300, minWidth = 250)

lmap <- leaflet(dt) |>
  amap() |>
  addMarkers(
    # options = popupOptions(maxWidth = 300, minWidth = 250),
      popup = ~paste0(
        "<div style='min-width:200px; font-size:16px;'>",
        "<b>", name, "</b><br><br>",
        "<button onclick=\"window.open('", urlinf, "','_blank')\"
         style='background-color: #0066cc; color: white; border: none;
                padding: 10px; margin: 5px 0; width: 100%;
                border-radius: 5px; font-size:16px;'>
        🔗 ", txt.inf, "
      </button><br>",
        "<button onclick=\"window.open('", urlamap, "','_blank')\"
         style='background-color: #cc3300; color: white; border: none;
                padding: 10px; margin: 5px 0; width: 100%;
                border-radius: 5px; font-size:16px;'>
        📚 ", txt.gps, "
      </button>",
        "</div>"
      ),
      clusterOptions = markerClusterOptions()  # 点聚合功能
          )    |>
addPolygons(
  data = gzmap,  # 你的sf对象
  color = "#baddf1",   # 边界线颜色（红色）
  weight = 3,          # 边界线宽度
  opacity = 1,         # 边界线不透明度
  fillColor = "transparent",  # 填充颜色（透明）
  fillOpacity = 0,     # 填充不透明度
  label = ~乡镇名        # 悬停标签（使用sf对象中的name字段）
)
lmap

# 保存为HTML
library(htmlwidgets)
saveWidget(lmap, file = "广州献血优待证景点地图.html")