用“NetworkD3”更改Sankey图的颜色字体

Question

我想要唱彩色字体，或添加一个阴影字体，以提高可见度。不过，我还没找到办法。另一种选择是巧妙地使用，但是当你在一个闪亮的应用程序中放置一个巧妙的对象，并在手机中将其可视化时，你就会失去交互式标签，因此networkD3能够更好地整合。唯一的问题是，我有不同的个性评价。我想改变字体颜色。

可重复性的例子：

library(networkD3)
URL <- paste0('https://cdn.rawgit.com/christophergandrud/networkD3/',
              'master/JSONdata/energy.json')
energy <- jsonlite::fromJSON(URL)

# Plot
sankeyNetwork(Links = energy$links, Nodes = energy$nodes, Source = 'source',
              Target = 'target', Value = 'value', NodeID = 'name',
              units = 'TWh', fontSize = 12, nodeWidth = 30)

Answer 1

文本元素可以修改我从包onRender中添加的htmlwidgets脚本。该函数允许您运行其他javascript函数，用于使用D3选择和修改元素。该职能的结构如下：

p <- onRender(myplot,'function(el, x){ 
    ...
}') 

使用该示例，您可以使用d3.selectAll选择标签(这将返回每个元素；只对单个元素或第一个元素使用d3.select() )。

// Sankey selector for node labels
d3.selectAll(".node text")

修改<text>元素的颜色可以使用style('some prop', 'some value')完成。例如，假设我们希望将文本更改为blue。

d3.selectAll(".node text").style("fill", "blue") // or hex, rgb, hsl, etc.

使用上面的例子，下面是如何编写它的方法。

library(networkD3)
URL <- 'https://cdn.rawgit.com/christophergandrud/networkD3/master/JSONdata/energy.json'
energy <- jsonlite::fromJSON(URL)

# Plot
sankey <- sankeyNetwork(
  Links = energy$links, Nodes = energy$nodes, Source = 'source',
  Target = 'target', Value = 'value', NodeID = 'name',
  units = 'TWh', fontSize = 12, nodeWidth = 30
)

# render with js
sankey_rendered <- htmlwidgets::onRender(sankey,
  'function(el, x) {
    d3.selectAll(".node text")
        .style("fill", "blue");
  }'
)

# show
sankey_rendered

如果您想要对标签做更多的事情(例如，鼠标事件、单击)，那么将D3选择结果分配给一个变量。

var labels = d3.selectAll(".node text");