Comments (6)
Hi, thanks for raising the issue, that is an interesting use case.
As you may know, netgraph uses matplotlib for drawing all visual elements, including text objects. However, matplotlib doesn't really do hyperlinks, as the imagined end-point is an image (and images are not text files, and hence don't support hyperlinks). Matplotlib does support hyperlinks when using the SVG backend (as SVG files are text files, ultimately) but the SVG backend is not interactive. As netgraph makes ample use of matplotlib's interactive events, netgraph cannot support matplotlib hyperlinks.
However, it is fairly straightforward to emulate hyperlinks using matplotlib pick events in combination with the (python built-in) webbrowser
module. Below some examples.
#!/usr/bin/env python
import webbrowser
import matplotlib.pyplot as plt
from netgraph import InteractiveGraph
fig, ax = plt.subplots()
# Enable picking.
def on_pick(event):
if isinstance(event.artist, plt.Text):
webbrowser.open(event.artist.get_text())
fig.canvas.mpl_connect('pick_event', on_pick)
# Define some links.
node_labels = {
0 : "https://stackoverflow.com/a/54121221/2912349",
1 : "https://stackoverflow.com/a/69682368/2912349"
}
annotations = {(0, 1) : "https://matplotlib.org/stable/gallery/event_handling/pick_event_demo.html"}
# Create a graph.
g = InteractiveGraph([(0, 1)], node_labels=node_labels, node_label_offset=0.05, annotations=annotations, ax=ax)
# Enable pick events on text objects.
# By (matplotlib) default, pick events are disabled.
for text_object in g.node_label_artists.values():
text_object.set_picker(True)
# Annotation text objects are created on-the-fly.
# We hence have to monkkeypatch the InteractiveGraph instance to enable the picker,
# whenever an annotation is created.
original_add_annotation = g._add_annotation
def new_add_annotation(artist, *args, **kwargs):
original_add_annotation(artist, *args, **kwargs)
text_object = g.artist_to_text_object[artist]
text_object.set_picker(True)
g._add_annotation = new_add_annotation
plt.show()
################################################################################
# Naturally, hyperlinks need not be text objects.
from netgraph._artists import NodeArtist, EdgeArtist
fig, ax = plt.subplots()
def on_pick(event):
if isinstance(event.artist, (NodeArtist, EdgeArtist)):
if hasattr(event.artist, 'url'):
webbrowser.open(event.artist.url)
fig.canvas.mpl_connect('pick_event', on_pick)
g = InteractiveGraph([(0, 1)], node_labels=True, ax=ax)
g.node_artists[0].set_picker(True)
g.node_artists[0].url = "www.google.com"
g.edge_artists[(0, 1)].set_picker(10) # increase pick radius for thin edges
g.edge_artists[(0, 1)].url = "www.stackoverflow.com"
plt.show()
I hope that addresses your issue. Make sure to install the latest version as I just fixed a bug that occurred when annotating edges (or change the edge annotation to a node annotation in the example above).
from netgraph.
Seemed to be an issue with webbrowser
module, got it working now thanks!
from netgraph.
I have added some simple examples to the documentation here. I will close the issue for now, but feel free to re-open it if you have any further concerns.
from netgraph.
Wow thanks for the excellent write up! Will try this next week 👍
from netgraph.
@paulbrodersen
I was able to get everything working as far as having annotations that hyperlink to the url that is the text of the annotation, like below:
annotations = {0: dict(s="www.google.com")}
But what about an annotation with text equal to some info about the node, and another attribute url
that is used for the hyperlink, sort of like this:
annotations = {0: dict(s="ANNOTATION TEXT", url='www.google.com')}
I tried your snippet under "Naturally, hyperlinks need not be text objects." section but the annotations don't hyperlink out.
I changed the on_pick()
method to pass the event.artist.url
to webbrowser.open()
with no luck. Does anything else need to be changed? How can I (or do I need to) enable picking on the 'url' attribute of the annotation?
from netgraph.
You probably forgot to enable the picker?
import webbrowser
import matplotlib.pyplot as plt
from netgraph import InteractiveGraph
def on_pick(event):
webbrowser.open(event.artist.get_url())
fig, ax = plt.subplots()
g = InteractiveGraph([(0, 1)], node_labels=True, annotations={0 : dict(s='lorem ipsum', url='www.google.com', picker=True)})
fig.canvas.mpl_connect('pick_event', on_pick)
plt.show()
from netgraph.
Related Issues (20)
- Issue with Node-Edge Connection when using Custom Shapes HOT 4
- Proper format for entering node_labels ? HOT 1
- Multipartite/Shell layouts not working if the number of nodes per layer/shell are not equal HOT 1
- Opacity behavior when removing vertex HOT 2
- Problems with very large graphs HOT 12
- Installation not working with python 3.11 HOT 5
- Minor documentation issues HOT 3
- ArcDiagram throws warning, does not label nodes, does not preserve node order. HOT 2
- Way to specify linestyle for edges? HOT 2
- Unable to use Community layout for Multi-Component graph? HOT 4
- Issues with MultiGraph HOT 14
- Not specifying node_edge_width when node_size is small causes node colours to not show up HOT 2
- How can I change the direction of a dot graph? HOT 1
- Strange Axis BoundingBox "diamond" HOT 3
- Combining interactive graphs with networkx subgraph functions? HOT 6
- (Suggestion) Handling div-by-zero HOT 1
- (Un)directed mixed graph HOT 5
- Changing arrow size while keeping edge width intact HOT 3
- self-loop labeling problem using EditableGraph HOT 2
- Embedding NetGraph EditableGraph in PyQt5 HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from netgraph.