使用 HTMLWidget 在 networkD3 上的文本阴影

Question

我使用 networkD3 包在 R 中构建了一个 Sankey 图，我想将文本阴影添加到节点标签。实际上，我需要的是以某种方式概述文本，因为我的原始数据非常复杂，并且某些文本与连接节点的“线”混淆了。这是我在 Whosebug 上发现的应该可以正常工作的方法，但如果有人有任何其他想法，我愿意接受新方法。

我发现了一个问题，其实现似乎与我的非常相似：Bold text in R using networkD3 package

但是当我尝试同样的方法时，没有任何反应。

通用数据为：

library(networkD3)
URL <- "https://cdn.rawgit.com/christophergandrud/networkD3/master/JSONdata/energy.json"
Energy <- jsonlite::fromJSON(URL)
sn <- sankeyNetwork(Links = Energy$links, Nodes = Energy$nodes, Source = "source",
              Target = "target", Value = "value", NodeID = "name",
              fontSize = 14, nodeWidth = 20, height = 900, width = 700, units = "px")

像这样，我自己尝试使用htmlwidgets的onRender功能，但没有用。因此，我修改了上述主题的代码，但生成的小部件没有任何变化：

library(htmlwidgets)
onRender(sn,
         '
  function(el) {
    d3.selectAll(".node text").attr("text-shadow", "1px 0 white, -1px 0 white, 0 1px white, 0-1px white")
  }
  '
)

Answer 1

要应用 CSS 样式，您需要使用 .style() 而不是 .attr()...

htmlwidgets::onRender(sn, jsCode = '
  function(el) {
    d3.selectAll(".node text").style("text-shadow", "1px 0 white, -1px 0 white, 0 1px white, 0 -1px white")
  }
')

使用 HTMLWidget 在 networkD3 上的文本阴影

Text shadow on networkD3 using HTMLWidget

javascript

r

d3.js

htmlwidgets

networkd3