我在將 sankeyNetwork 中的矩形更改為 R 的 networkd3 包中的圓形時遇到問題。到目前為止，我的 onrender js 代碼僅洗掉了矩形，不確定為什么沒有添加圓形。
這是我的代碼：
htmlwidgets::onRender(
p,
'
function(el,x){
//node variable
var node=d3.select(el).select("svg").selectAll(".node");
//remove node
node.selectAll("rect")
.remove();
// add circles instead
node
.append("circle")
.attr("cx",sankey.nodeWidth()/2)
.attr("cy",function(d){
return d.dy/2;
})
.attr("r",function(d){
return Math.sqrt(d.dy);})
.style("fill", function(d) {
return d.color = color_node(d); })
.style("stroke", function(d) { return d3.rgb(d.color).darker(2); })
.style("opacity", 0.9)
.style("cursor", "move")
.append("title")
.append("foreignObject")
.append("xhtml:body")
.html(function(d) { return "<pre>" d.name "<br>" format(d.value)
" " options.units "</pre>"; })
;
}
'
)
uj5u.com熱心網友回復：
您參考了一些不在您的函式范圍內的變數和函式...
library(jsonlite)
library(networkD3)
library(htmlwidgets)
URL <- paste0('https://cdn.rawgit.com/christophergandrud/networkD3/',
'master/JSONdata/energy.json')
energy <- jsonlite::fromJSON(URL)
p <- sankeyNetwork(Links = energy$links, Nodes = energy$nodes, Source = 'source',
Target = 'target', Value = 'value', NodeID = 'name',
units = 'TWh', fontSize = 12, nodeWidth = 30)
htmlwidgets::onRender(
p,
'
function(el,x){
// map the variables you are trying to use below
var options = x.options;
var sankey = this.sankey;
// replicate the private functions from the renderValue function that you call below
var color = eval(options.colourScale);
var color_node = function color_node(d){
if (d.group){
return color(d.group.replace(/ .*/, ""));
} else {
return "#cccccc";
}
}
var formatNumber = d3.format(",.0f"),
format = function(d) {
if (typeof d === "string") return d;
return formatNumber(d);
}
//node variable
var node=d3.select(el).select("svg").selectAll(".node");
//remove node
node.selectAll("rect")
.remove();
// add circles instead
node
.append("circle")
.attr("cx",sankey.nodeWidth()/2)
.attr("cy",function(d){
return d.dy/2;
})
.attr("r",function(d){
return Math.sqrt(d.dy);})
.style("fill", function(d) {
return d.color = color_node(d); })
.style("stroke", function(d) { return d3.rgb(d.color).darker(2); })
.style("opacity", 0.9)
.style("cursor", "move")
.append("title")
.append("foreignObject")
.append("xhtml:body")
.html(function(d) { return "<pre>" d.name "<br>" format(d.value)
" " options.units "</pre>"; })
;
}
'
)
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/326038.html
標籤：javascript r d3.js htmlwidgets 网络d3