Skip to content

Instantly share code, notes, and snippets.

@jalapic
Last active February 17, 2023 07:33
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jalapic/9402a5bff57cd35c4d1b to your computer and use it in GitHub Desktop.
Save jalapic/9402a5bff57cd35c4d1b to your computer and use it in GitHub Desktop.
testing clickaction
library(randomNames)
library(networkD3)
library(igraph)
set.seed(3)
nl = 100
df = data.frame(source = randomNames(1000,which.names='both', name.order = 'first.last', name.sep=' '), target = '')
df = df[rep(seq_len(nrow(df)), sample(1:10,nrow(df), replace=T)),]
df = df[sample(nrow(df),nl),]
df$target = sample(df$source,nrow(df), replace = T)
df = df[df[,1]!=df[,2], ]
#vertices and graph
vertices<-data.frame('name' = unique(unlist(df)))
g = graph.data.frame(df, directed=F, vertices=vertices)
vertices$group = edge.betweenness.community(g)$membership
vertices$size <- (betweenness(g,directed=F,normalized=T)*115)+0.1
# indices
df$source.index = match(df$source, vertices$name)-1
df$target.index = match(df$target, vertices$name)-1
## Attempt at making a script to add text when node clicked
myClickScript <- "d3.selectAll('text#textid').remove(); d3.select(this).append('text').text('some text in here').attr('id', 'textid')
.attr('x', 110).attr('y',110).style('font-size','34px');"
d3 = forceNetwork(Links = df, Nodes = vertices,
Source = 'source.index', Target = 'target.index',
NodeID = 'name',
Group = 'group',
Nodesize = 'size',
charge = -50,
linkDistance = 20,
colourScale = JS('d3.scale.ordinal()
.range(["#e70351", "#e8fd02", "#eb03fe", "#fb9104", "#fd99ee", "#e8d97d", "#ea958a", "#fd01af", "#fc3002"])
.domain(d3.range(0,9))'),
zoom = T,
opacity = 0.9,
clickAction = myClickScript)
show(d3)
@timelyportfolio
Copy link

I would change as follows with comments inline.

library(randomNames)
library(networkD3)
library(igraph)
set.seed(3)

nl = 100
df = data.frame(source = randomNames(1000,which.names='both', name.order = 'first.last', name.sep=' '), target = '')
df = df[rep(seq_len(nrow(df)), sample(1:10,nrow(df), replace=T)),]
df = df[sample(nrow(df),nl),] 
df$target = sample(df$source,nrow(df), replace = T)
df = df[df[,1]!=df[,2], ] 

#vertices and graph
vertices<-data.frame('name' = unique(unlist(df))) 
g = graph.data.frame(df, directed=F, vertices=vertices) 
vertices$group = edge.betweenness.community(g)$membership 
vertices$size <- (betweenness(g,directed=F,normalized=T)*115)+0.1

# indices
df$source.index = match(df$source, vertices$name)-1
df$target.index = match(df$target, vertices$name)-1



## Attempt at making a script to add text when node clicked
myClickScript <-   "
// debugger is always our friend :)
debugger;

// use d3 enter, update, exit
//  make sure to get svg g so our tooltip will move with zoom&drag
var tooltip = d3.select(el).select('svg g').selectAll('text#textid')
  .data([d.name + ' | group: ' + d.group]);

// add if not there yet
tooltip.enter().append('text')

// update our attributes
tooltip
  .text(function(d){return d;})
  .attr('id', 'textid')
  .attr({'x':d.x,'y':d.y})
  .style('font-size','34px');
"


d3 = forceNetwork(Links = df, Nodes = vertices,
                  Source = 'source.index', Target = 'target.index',
                  NodeID = 'name',
                  Group = 'group', 
                  Nodesize = 'size', 
                  charge = -50, 
                  linkDistance = 20,
                  colourScale = JS('d3.scale.ordinal()
                                    .range(["#e70351", "#e8fd02", "#eb03fe", "#fb9104", "#fd99ee", "#e8d97d", "#ea958a", "#fd01af", "#fc3002"])
                                   .domain(d3.range(0,9))'),
                  zoom = T, 
                  opacity = 0.9,
                  clickAction = myClickScript)

show(d3)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment