懸停散點圖時顯示變量名稱

Question

這是使用{echarts4r}繪制的圖，來自GitHub 上的這個答案：

library(echarts4r)
library(tibble)

mtcars %>%
  rownames_to_column("model") %>%  
  e_charts(mpg) %>%
  e_y_axis(drat) %>%
  e_scatter(drat, symbol_size = 15, bind = model, scale = NULL) %>%
  e_tooltip(formatter = htmlwidgets::JS("
              function(params){
                return('<strong>' + params.name +  
              '</strong><br />x-axis: ' + params.value[0] +  
                '<br />y-axis: ' + params.value[1]
                )} 
              "))

如您所見，當您懸停某個點時，會顯示汽車型號的名稱和值。 但是，我不知道如何以相同的方式顯示變量名稱。 我知道我可以用他們的名字手動替換“x 軸”和“y 軸”，但我想自動完成。

我檢查了關於這個的 echarts 文檔，但是使用{a} （例如）不起作用。

任何的想法？

編輯：我使用echarts4r 0.3.3

Answer 1

我試圖了解我是否正在研究您可能真正需要的東西......我想你想要靈活名稱的原因是讓它有一個單獨的函數，以便在你需要的時候打電話給你......

那么這個怎么樣？ 它使用一種解決方法來避免名稱（從某種意義上說，您將字符串而不是未加引號的名稱傳遞給函數）。 但是，如果您需要使用名稱，我們可以嘗試其他方法。

library(echarts4r)
library(tibble)


plot_escatter <- function(df, x_axis, y_axis, bind){
    
    df %>%
        e_charts_ (x_axis) %>%
        e_y_axis_ (y_axis) %>%
        e_scatter_(y_axis, symbol_size = 15, bind = bind, scale = NULL) %>%
        e_tooltip(formatter = htmlwidgets::JS(paste0("
              function(params){
                return('<strong>' + params.name + '</strong><br />", x_axis, ": ' + params.value[0] +  
                '<br />", y_axis, ": ' + params.value[1]
                )} 
              ")))
    
}


mtcars %>% 
    rownames_to_column("model") %>%  
    plot_escatter("mpg", "drat", "model")

Answer 2

您要求的東西在為 e_tooltip 傳遞的參數中不存在。 您可以通過將params傳遞給console.log並在瀏覽器中檢查此日志來訪問它們：

mtcars %>%
  rownames_to_column("model") %>%  
  e_charts(mpg) %>%
  e_y_axis(drat) %>%
  e_scatter(drat, symbol_size = 15, bind = model, scale = NULL) %>%
  e_tooltip(formatter = htmlwidgets::JS("
              function(params){
              var obj_str = JSON.stringify(params);
              console.log(obj_str);
                return('<strong>' + params.name +  
              '</strong><br />' + params.seriesName + ': ' + params.value[0] +  
                '<br />mpg: ' + params.value[1]
                )} 
              "))

您會注意到 x 軸名稱在params.seriesName下， params.seriesName找到 y 軸名稱。

這是一個示例，說明如果您要檢查console.log中的params會發現什么：

{"componentType":"series",
  "componentSubType":"scatter",
  "componentIndex":0,
  "seriesType":"scatter",
  "seriesIndex":0,
  "seriesId":"\u0000drat\u00000",
  "seriesName":"drat",
  "name":"Ford Pantera L",
  "dataIndex":9,
  "data":{"value":[15.8,4.22],
  "name":"Ford Pantera L"},
  "value":[15.8,4.22],
  "color":"#c23531",
  "dimensionNames":["x","y"],
  "encode":{"x":[0],"y":[1]},
  "marker":"<span style=\"display:inline-block;
            margin-right:5px;
            border-radius:10px;
            width:10px;height:10px;
            background-color:#c23531;\"></span>",
  "$vars":["seriesName","name","value"]
}

在這種情況下，下面paste0方法似乎非常合理。

Answer 3

請在下面找到代碼：

您需要使用params.seriesName來訪問列名

    mtcars %>%   
  tibble::rownames_to_column("model") %>%  
  e_charts(wt) %>%  
  e_scatter(mpg, qsec, bind = model, scale = NULL) %>% 
  e_tooltip(formatter = htmlwidgets::JS(" 
    function(params){ 
      return('<strong>' + params.seriesName + 
              '</strong><br />wt: ' + params.value[0] +  
              '<br />mpg: ' + params.value[1] + '<br> qsec:' + params.value[2]   
              )} 
        "))