How to remove fade when hovering in networkD3 graph in R

I have been looking at the examples for using networkd3 in r

I wanted to know if it would be possible to remove the hover effect where when you hover over a certain node in the graph everything else fades? See "Interacting with igraph" in https://christophergandrud.github.io/networkD3/.

I looked at the package documentation but there didn't seem to be any option to remove the hover effect. Thanks.

edited Jan 2 at 19:28

CJ Yetman

4,1252631

asked Jan 2 at 3:01

Tillie

184

That's not a built-in feature, but a reasonable suggestion... you can submit a feature request at github.com/christophergandrud/networkD3/issues

– CJ Yetman
Jan 2 at 8:15

add a comment |

I have been looking at the examples for using networkd3 in r

I looked at the package documentation but there didn't seem to be any option to remove the hover effect. Thanks.

edited Jan 2 at 19:28

CJ Yetman

4,1252631

asked Jan 2 at 3:01

Tillie

184

That's not a built-in feature, but a reasonable suggestion... you can submit a feature request at github.com/christophergandrud/networkD3/issues

– CJ Yetman
Jan 2 at 8:15

add a comment |

I have been looking at the examples for using networkd3 in r

I looked at the package documentation but there didn't seem to be any option to remove the hover effect. Thanks.

edited Jan 2 at 19:28

CJ Yetman

4,1252631

asked Jan 2 at 3:01

Tillie

184

I have been looking at the examples for using networkd3 in r

I looked at the package documentation but there didn't seem to be any option to remove the hover effect. Thanks.

javascript r d3.js htmlwidgets networkd3

edited Jan 2 at 19:28

CJ Yetman

4,1252631

asked Jan 2 at 3:01

Tillie

184

edited Jan 2 at 19:28

CJ Yetman

4,1252631

asked Jan 2 at 3:01

Tillie

184

edited Jan 2 at 19:28

CJ Yetman

4,1252631

edited Jan 2 at 19:28

CJ Yetman

4,1252631

edited Jan 2 at 19:28

CJ Yetman

4,1252631

asked Jan 2 at 3:01

Tillie

184

asked Jan 2 at 3:01

Tillie

184

asked Jan 2 at 3:01

Tillie

184

That's not a built-in feature, but a reasonable suggestion... you can submit a feature request at github.com/christophergandrud/networkD3/issues

– CJ Yetman
Jan 2 at 8:15

add a comment |

That's not a built-in feature, but a reasonable suggestion... you can submit a feature request at github.com/christophergandrud/networkD3/issues

– CJ Yetman
Jan 2 at 8:15

That's not a built-in feature, but a reasonable suggestion... you can submit a feature request at github.com/christophergandrud/networkD3/issues

– CJ Yetman
Jan 2 at 8:15

add a comment |

2 Answers
2

active

oldest

votes

I think the easiest way to do this is to disable the mouseover function...

library(networkD3)

library(htmlwidgets)



fn <- forceNetwork(Links = MisLinks, Nodes = MisNodes, Source = "source", 

                   Target = "target", Value = "value", NodeID = "name",

                   Group = "group", opacity = 1)



onRender(fn, "function(el,x) { d3.selectAll('.node').on('mouseover', null); }")

answered Jan 2 at 8:29

CJ Yetman

4,1252631

Thank you. I tried this although it removes the transparency on hover, it also removes the labels on hover. I would like to keep the labels.

– Tillie
Jan 2 at 17:33

You can add the opacityNoHover = 1 parameter to make the labels be non-transparent all the time. If you want some/any action to take place on mouseover other than the default (rather than no action), than you will have to overwrite the mouseover function with a new one.

– CJ Yetman
Jan 2 at 19:27

Okay, thank you very much.

– Tillie
Jan 3 at 15:01

add a comment |

Here is a solution. It requires you edit the associated JS file. I don't believe there is an easier way around this. You could easily create a function out of the below code though.

# Load package

library(networkD3)



# Create a network graph.

src <- c("A", "A", "A", "A",

        "B", "B", "C", "C", "D")

target <- c("B", "C", "D", "J",

            "E", "F", "G", "H", "I")

networkData <- data.frame(src, target)



# Create widget.

widget <- simpleNetwork(networkData)



# Define (temporary) path to where the widget will be saved.

file <- tempfile(pattern = "file", tmpdir = dir <- tempdir(), fileext = ".html")



# Save widget.

htmlwidgets::saveWidget(widget, file = file, selfcontained = FALSE)



# Define path to where js file is we want to edit.

js_path <- paste0(dir, "/", gsub(".*\\|\..*", "", file), "_files/forceNetwork-binding-0.4/forceNetwork.js")



# Read in JS file.

js <- readLines(js_path)



# Edit relevant line so that no transparency occurs on hover.

js <- gsub("var unfocusDivisor = 4;", "var unfocusDivisor = 1;", js)

writeLines(js, con = js_path)



# Open graph

browseURL(paste0("file://", file))

answered Jan 2 at 5:07

Khaynes

717620

add a comment |

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54000758%2fhow-to-remove-fade-when-hovering-in-networkd3-graph-in-r%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

2 Answers
2

active

oldest

votes

2 Answers
2

active

oldest

votes

I think the easiest way to do this is to disable the mouseover function...

library(networkD3)

library(htmlwidgets)



fn <- forceNetwork(Links = MisLinks, Nodes = MisNodes, Source = "source", 

                   Target = "target", Value = "value", NodeID = "name",

                   Group = "group", opacity = 1)



onRender(fn, "function(el,x) { d3.selectAll('.node').on('mouseover', null); }")

answered Jan 2 at 8:29

CJ Yetman

4,1252631

Thank you. I tried this although it removes the transparency on hover, it also removes the labels on hover. I would like to keep the labels.

– Tillie
Jan 2 at 17:33

You can add the opacityNoHover = 1 parameter to make the labels be non-transparent all the time. If you want some/any action to take place on mouseover other than the default (rather than no action), than you will have to overwrite the mouseover function with a new one.

– CJ Yetman
Jan 2 at 19:27

Okay, thank you very much.

– Tillie
Jan 3 at 15:01

add a comment |

I think the easiest way to do this is to disable the mouseover function...

library(networkD3)

library(htmlwidgets)



fn <- forceNetwork(Links = MisLinks, Nodes = MisNodes, Source = "source", 

                   Target = "target", Value = "value", NodeID = "name",

                   Group = "group", opacity = 1)



onRender(fn, "function(el,x) { d3.selectAll('.node').on('mouseover', null); }")

answered Jan 2 at 8:29

CJ Yetman

4,1252631

Thank you. I tried this although it removes the transparency on hover, it also removes the labels on hover. I would like to keep the labels.

– Tillie
Jan 2 at 17:33

You can add the opacityNoHover = 1 parameter to make the labels be non-transparent all the time. If you want some/any action to take place on mouseover other than the default (rather than no action), than you will have to overwrite the mouseover function with a new one.

– CJ Yetman
Jan 2 at 19:27

Okay, thank you very much.

– Tillie
Jan 3 at 15:01

add a comment |

I think the easiest way to do this is to disable the mouseover function...

library(networkD3)

library(htmlwidgets)



fn <- forceNetwork(Links = MisLinks, Nodes = MisNodes, Source = "source", 

                   Target = "target", Value = "value", NodeID = "name",

                   Group = "group", opacity = 1)



onRender(fn, "function(el,x) { d3.selectAll('.node').on('mouseover', null); }")

answered Jan 2 at 8:29

CJ Yetman

4,1252631

I think the easiest way to do this is to disable the mouseover function...

library(networkD3)

library(htmlwidgets)



fn <- forceNetwork(Links = MisLinks, Nodes = MisNodes, Source = "source", 

                   Target = "target", Value = "value", NodeID = "name",

                   Group = "group", opacity = 1)



onRender(fn, "function(el,x) { d3.selectAll('.node').on('mouseover', null); }")

answered Jan 2 at 8:29

CJ Yetman

4,1252631

answered Jan 2 at 8:29

CJ Yetman

4,1252631

answered Jan 2 at 8:29

CJ Yetman

4,1252631

answered Jan 2 at 8:29

CJ Yetman

4,1252631

Thank you. I tried this although it removes the transparency on hover, it also removes the labels on hover. I would like to keep the labels.

– Tillie
Jan 2 at 17:33

You can add the opacityNoHover = 1 parameter to make the labels be non-transparent all the time. If you want some/any action to take place on mouseover other than the default (rather than no action), than you will have to overwrite the mouseover function with a new one.

– CJ Yetman
Jan 2 at 19:27

Okay, thank you very much.

– Tillie
Jan 3 at 15:01

add a comment |

Thank you. I tried this although it removes the transparency on hover, it also removes the labels on hover. I would like to keep the labels.

– Tillie
Jan 2 at 17:33

You can add the opacityNoHover = 1 parameter to make the labels be non-transparent all the time. If you want some/any action to take place on mouseover other than the default (rather than no action), than you will have to overwrite the mouseover function with a new one.

– CJ Yetman
Jan 2 at 19:27

Okay, thank you very much.

– Tillie
Jan 3 at 15:01

Thank you. I tried this although it removes the transparency on hover, it also removes the labels on hover. I would like to keep the labels.

– Tillie
Jan 2 at 17:33

You can add the opacityNoHover = 1 parameter to make the labels be non-transparent all the time. If you want some/any action to take place on mouseover other than the default (rather than no action), than you will have to overwrite the mouseover function with a new one.

– CJ Yetman
Jan 2 at 19:27

Okay, thank you very much.

– Tillie
Jan 3 at 15:01

add a comment |

Here is a solution. It requires you edit the associated JS file. I don't believe there is an easier way around this. You could easily create a function out of the below code though.

# Load package

library(networkD3)



# Create a network graph.

src <- c("A", "A", "A", "A",

        "B", "B", "C", "C", "D")

target <- c("B", "C", "D", "J",

            "E", "F", "G", "H", "I")

networkData <- data.frame(src, target)



# Create widget.

widget <- simpleNetwork(networkData)



# Define (temporary) path to where the widget will be saved.

file <- tempfile(pattern = "file", tmpdir = dir <- tempdir(), fileext = ".html")



# Save widget.

htmlwidgets::saveWidget(widget, file = file, selfcontained = FALSE)



# Define path to where js file is we want to edit.

js_path <- paste0(dir, "/", gsub(".*\\|\..*", "", file), "_files/forceNetwork-binding-0.4/forceNetwork.js")



# Read in JS file.

js <- readLines(js_path)



# Edit relevant line so that no transparency occurs on hover.

js <- gsub("var unfocusDivisor = 4;", "var unfocusDivisor = 1;", js)

writeLines(js, con = js_path)



# Open graph

browseURL(paste0("file://", file))

answered Jan 2 at 5:07

Khaynes

717620

add a comment |

Here is a solution. It requires you edit the associated JS file. I don't believe there is an easier way around this. You could easily create a function out of the below code though.

# Load package

library(networkD3)



# Create a network graph.

src <- c("A", "A", "A", "A",

        "B", "B", "C", "C", "D")

target <- c("B", "C", "D", "J",

            "E", "F", "G", "H", "I")

networkData <- data.frame(src, target)



# Create widget.

widget <- simpleNetwork(networkData)



# Define (temporary) path to where the widget will be saved.

file <- tempfile(pattern = "file", tmpdir = dir <- tempdir(), fileext = ".html")



# Save widget.

htmlwidgets::saveWidget(widget, file = file, selfcontained = FALSE)



# Define path to where js file is we want to edit.

js_path <- paste0(dir, "/", gsub(".*\\|\..*", "", file), "_files/forceNetwork-binding-0.4/forceNetwork.js")



# Read in JS file.

js <- readLines(js_path)



# Edit relevant line so that no transparency occurs on hover.

js <- gsub("var unfocusDivisor = 4;", "var unfocusDivisor = 1;", js)

writeLines(js, con = js_path)



# Open graph

browseURL(paste0("file://", file))

answered Jan 2 at 5:07

Khaynes

717620

add a comment |

Here is a solution. It requires you edit the associated JS file. I don't believe there is an easier way around this. You could easily create a function out of the below code though.

# Load package

library(networkD3)



# Create a network graph.

src <- c("A", "A", "A", "A",

        "B", "B", "C", "C", "D")

target <- c("B", "C", "D", "J",

            "E", "F", "G", "H", "I")

networkData <- data.frame(src, target)



# Create widget.

widget <- simpleNetwork(networkData)



# Define (temporary) path to where the widget will be saved.

file <- tempfile(pattern = "file", tmpdir = dir <- tempdir(), fileext = ".html")



# Save widget.

htmlwidgets::saveWidget(widget, file = file, selfcontained = FALSE)



# Define path to where js file is we want to edit.

js_path <- paste0(dir, "/", gsub(".*\\|\..*", "", file), "_files/forceNetwork-binding-0.4/forceNetwork.js")



# Read in JS file.

js <- readLines(js_path)



# Edit relevant line so that no transparency occurs on hover.

js <- gsub("var unfocusDivisor = 4;", "var unfocusDivisor = 1;", js)

writeLines(js, con = js_path)



# Open graph

browseURL(paste0("file://", file))

answered Jan 2 at 5:07

Khaynes

717620

Here is a solution. It requires you edit the associated JS file. I don't believe there is an easier way around this. You could easily create a function out of the below code though.

# Load package

library(networkD3)



# Create a network graph.

src <- c("A", "A", "A", "A",

        "B", "B", "C", "C", "D")

target <- c("B", "C", "D", "J",

            "E", "F", "G", "H", "I")

networkData <- data.frame(src, target)



# Create widget.

widget <- simpleNetwork(networkData)



# Define (temporary) path to where the widget will be saved.

file <- tempfile(pattern = "file", tmpdir = dir <- tempdir(), fileext = ".html")



# Save widget.

htmlwidgets::saveWidget(widget, file = file, selfcontained = FALSE)



# Define path to where js file is we want to edit.

js_path <- paste0(dir, "/", gsub(".*\\|\..*", "", file), "_files/forceNetwork-binding-0.4/forceNetwork.js")



# Read in JS file.

js <- readLines(js_path)



# Edit relevant line so that no transparency occurs on hover.

js <- gsub("var unfocusDivisor = 4;", "var unfocusDivisor = 1;", js)

writeLines(js, con = js_path)



# Open graph

browseURL(paste0("file://", file))

answered Jan 2 at 5:07

Khaynes

717620

answered Jan 2 at 5:07

Khaynes

717620

answered Jan 2 at 5:07

Khaynes

717620

answered Jan 2 at 5:07

Khaynes

717620

add a comment |

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Bdtjtk