更改 addMouseCoordinates 以显示十进制分钟秒而不是十进制度？

Posted 2023-03-24

【中文标题】更改 addMouseCoordinates 以显示十进制分钟秒而不是十进制度？

【英文标题】：Change addMouseCoordinates to display decimal minutes seconds instead of decimal degrees?

【发布时间】：2022-01-16 14:57:16

【问题描述】：

我需要能够以闪亮的方式显示传单地图，用户可以在地图上看到鼠标在地图上的位置（以度分秒为单位）。

addMouseCoordinates 添加鼠标坐标，但格式为十进制度。有没有办法改变它以度分秒显示？

library(leaflet)
library(leafem)

leaflet() %>%
  addProviderTiles("OpenStreetMap") %>%
  addMouseCoordinates()

【问题讨论】：

根据官方文档， >默认情况下只显示'lat'、'lon'和'zoom'。要显示有关 epsg 的详细信息，proj4 按住“Ctrl”并移动鼠标。 'Ctrl' + 单击会将地图顶部框/条的当前内容复制到剪贴板，但目前仅支持复制'lon'、'lat'和'zoom'，不支持'epsg'和' proj4'，因为这些不会随平移和缩放而改变。

您可以在这里找到文档：cran.r-project.org/web/packages/leafem/leafem.pdf

我试过改变 epsg 但它仍然没有改变纬度/经度的格式，它仍然以十进制度而不是 DMS 显示

【参考方案1】：

我已经编辑了leafem (addMouseCoordinates) 中的函数，将纬度和经度转换为度分秒。我还更改了框中的标签。

现在鼠标位置显示为“经度：dd°mm ss.sss E | 纬度：dd°mm ss.sss S” 当 ctrl + hover 时，仅显示十进制度的 lat 和 lon。

注意：我要展示的区域是澳大利亚西南部。所以我手动添加了“S”和“E”，但如果你想显示多个半球，则需要调整代码。

clipboardDependency = function() 
  list(
    htmltools::htmlDependency(
      name = "clipboard",
      version = "0.0.1",
      src = system.file("htmlwidgets/lib/clipboard", package = "leafem"),
      script = "setClipboardText.js"
    )
  )


addMouseCoordinates <- function(map,
                                epsg = NULL,
                                proj4string = NULL,
                                native.crs = FALSE) 
  
  if (inherits(map, "mapview")) map <- mapview2leaflet(map)
  stopifnot(inherits(map, c("leaflet", "leaflet_proxy", "mapdeck")))
  
  if (native.crs)  
    txt_detailed <- paste0("
                           ' x: ' + (e.latlng.lng).toFixed(5) +
                           ' | y: ' + (e.latlng.lat).toFixed(5) +
                           ' | epsg: ", epsg, " ' +
                           ' | proj4: ", proj4string, " ' +
                           ' | zoom: ' + map.getZoom() + ' '")
   else 
    txt_detailed <- paste0("
                            'Longitude: ' + (e.latlng.lng).toFixed(5) +
                            ' | Latitude: ' + ((e.latlng.lat).toFixed(5)) + 
                           ' (Decimal Degrees)'")
  
  

  txt_basic <- paste0("
                      'Longitude: ' + [0|(e.latlng.lng)] + 
                      '° ' + 
                      [0|((e.latlng.lng)<0?(e.latlng.lng)=-(e.latlng.lng):(e.latlng.lng))%1*60] +
                      ' ' + 
                      ((e.latlng.lng)*60%1*60).toFixed(3) +
                      ' E' +
                      
                      ' | Latitude: ' + [0|(e.latlng.lat)] + 
                      '° ' + 
                      [0|((e.latlng.lat)<0?(e.latlng.lat)=-(e.latlng.lat):(e.latlng.lat))%1*60] +
                      ' ' + 
                      ((e.latlng.lat)*60%1*60).toFixed(3) +
                      ' S (Degrees Minutes Seconds) '")
  
  map$dependencies = c(
    map$dependencies,
    clipboardDependency()
  )
  
  map <- htmlwidgets::onRender(
    map,
    paste0(
      "
      function(el, x, data) 
      // get the leaflet map
      var map = this; //HTMLWidgets.find('#' + el.id);
      // we need a new div element because we have to handle
      // the mouseover output separately
      // debugger;
      function addElement () 
      // generate new div Element
      var newDiv = $(document.createElement('div'));
      // append at end of leaflet htmlwidget container
      $(el).append(newDiv);
      //provide ID and style
      newDiv.addClass('lnlt');
      newDiv.css(
      'position': 'relative',
      'bottomleft':  '0px',
      'background-color': 'rgba(255, 255, 255, 0.7)',
      'box-shadow': '0 0 2px #bbb',
      'background-clip': 'padding-box',
      'margin': '0',
      'padding-left': '5px',
      'color': '#333',
      'font': '9px/1.5 \"Helvetica Neue\", Arial, Helvetica, sans-serif',
      'z-index': '700',
      );
      return newDiv;
      
      // check for already existing lnlt class to not duplicate
      var lnlt = $(el).find('.lnlt');
      if(!lnlt.length) 
      lnlt = addElement();
      // grab the special div we generated in the beginning
      // and put the mousmove output there
      map.on('mousemove', function (e) 
      if (e.originalEvent.ctrlKey) 
      if (document.querySelector('.lnlt') === null) lnlt = addElement();
      lnlt.text(", txt_detailed, ");
       else 
      if (document.querySelector('.lnlt') === null) lnlt = addElement();
      lnlt.text(", txt_basic, ");
      
      );
      // remove the lnlt div when mouse leaves map
      map.on('mouseout', function (e) 
      var strip = document.querySelector('.lnlt');
      if( strip !==null) strip.remove();
      );
      ;
      //$(el).keypress(67, function(e) 
      map.on('preclick', function(e) 
      if (e.originalEvent.ctrlKey) 
      if (document.querySelector('.lnlt') === null) lnlt = addElement();
      lnlt.text(", txt_basic, ");
      var txt = document.querySelector('.lnlt').textContent;
      console.log(txt);
      //txt.innerText.focus();
      //txt.select();
      setClipboardText('\"' + txt + '\"');
      
      );
      
      "
    )
  )
  map