Поместите текстовые значения вправо от диаграммы sankey

Question

Есть ли трюк для размещения текста на диаграмме sankey, отображаемой с помощью networkD3? Я хотел бы, чтобы значения конечных точек отображались как текст справа от их полей. Я понимаю, что зависание над полями отображает значение, но по мере того, как окна становятся меньше, во многих случаях было бы намного проще изобразить информацию, если бы значения всегда были видны сбоку.

Вот пример; Мне удалось обработать его, добавив значения как часть ярлыков, но было бы гораздо лучше иметь значения, отображаемые справа от диаграммы.

library(networkD3) 
library(data.table) 
set.seed(1999) 
links <- data.table(
    src = rep(0:4, times=c(1,1,2,3,5)), 
    target = sample(1:11, 12, TRUE), 
    value = sample(100, 12) 
)[src < target, ] # no loops 
nodes <- data.table(name=LETTERS[1:12]) 

## Need to hover to get counts 
sankeyNetwork(Links=links, Nodes=nodes, Source='src', Target='target', 
    Value='value', NodeID='name', fontSize=16) 

## Add text to label 
txt <- links[, .(total = sum(value)), by=c('target')] 
nodes[txt$target+1L, name := paste0(name, ' (', txt$total, ')')] 

## Displays the counts as part of the labels 
sankeyNetwork(Links=links, Nodes=nodes, Source='src', Target='target', 
    Value='value', NodeID='name', fontSize=16, width=600, height=300) 

Answer 1

К сожалению, я только сейчас наткнулся на это. Это было бы очень полезно для новой функции onRender в htmlwidgets. Я попытался прокомментировать строку, чтобы объяснить пару строк добавленного JavaScript для перемещения текста узла. networkD3 в этих lines, чтобы изменить размещение вправо или влево в зависимости от ширины. Мы просто применим это ко всему тексту, чтобы он был справа от наших прямоугольников узлов.

library(networkD3) 
library(data.table) 
set.seed(1999) 
links <- data.table(
    src = rep(0:4, times=c(1,1,2,3,5)), 
    target = sample(1:11, 12, TRUE), 
    value = sample(100, 12) 
)[src < target, ] # no loops 
nodes <- data.table(name=LETTERS[1:12]) 

## Need to hover to get counts 
sankeyNetwork(Links=links, Nodes=nodes, Source='src', Target='target', 
       Value='value', NodeID='name', fontSize=16) 

## Add text to label 
txt <- links[, .(total = sum(value)), by=c('target')] 
nodes[txt$target+1L, name := paste0(name, ' (', txt$total, ')')] 

## Displays the counts as part of the labels 
sankeyNetwork(Links=links, Nodes=nodes, Source='src', Target='target', 
       Value='value', NodeID='name', fontSize=16, width=600, height=300) 



#################### move leaf node text right ################ 
# for this to work 
# install the newest htmlwidgets 
# devtools::install_github("ramnathv/htmlwidgets") 

library(htmlwidgets) 
# add margin left since we'll need extra room 
# if you are wondering why margin left, 
# I think we just discovered a bug 
sn <- sankeyNetwork(
    Links=links, Nodes=nodes, Source='src', Target='target', 
    Value='value', NodeID='name', fontSize=16, 
    width=600, height=300, 
    # give us so room for our newly aligned labels 
    margin = list("left"=100) 
) 
# see how it looks 
sn 

# now let's use the new htmlwidget function 
# onRender 
onRender(
    sn, 
' 
function(el,x){ 
    // select all our node text 
    var node_text = d3.select(el) 
    .selectAll(".node text") 
    //and make them match 
    //https://github.com/christophergandrud/networkD3/blob/master/inst/htmlwidgets/sankeyNetwork.js#L180-L181 
    .attr("x", 6 + x.options.nodeWidth) 
    .attr("text-anchor", "start"); 
} 
' 
)