✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
⚡️ Concerned about the grid? Kyle Baranko teaches how to predicting peak loads using XGBoost. Register for the August webinar!

Plot 3D network graph

Hi All,

I’m trying to create a 3D network graph, the following is the code snippet

import networkx as nx
import plotly.graph_objects as go
from collections import OrderedDict
from sympy.geometry import Point


def distance_finder(s, t):
    p1, p2 = Point(s), Point(t)
    pmid = p1.midpoint(p2)
    return pmid.evalf()


def get_edge_trace(G):
    edge_x = []
    edge_y = []
    edge_z = []

    etext = [f'weight{w}' for w in list(nx.get_edge_attributes(G, 'weight').values())]
    xtext = [x]
    ytext = []
    ztext = []

    for edge in G.edges():

        x0, y0, z0 = G.nodes[edge[0]]['pos']
        x1, y1, z1 = G.nodes[edge[1]]['pos']

        mid = distance_finder(s=[x0, y0, z0], t=[x1, y1, z1])
        xtext.append(mid.x)
        ytext.append(mid.y)
        ztext.append(mid.z)

        edge_x.append(x0)
        edge_x.append(x1)
        edge_x.append(None)
        edge_y.append(y0)
        edge_y.append(y1)
        edge_y.append(None)
        edge_z.append(z0)
        edge_z.append(z1)
        edge_z.append(None)

    edge_trace = go.Scatter3d(
        x=edge_x, y=edge_y, z=edge_z,
        line=dict(width=0.5, color='#888'),
        mode='lines'
    )
    eweights_trace = go.Scatter3d(x=xtext, y=ytext, z=ztext, mode='text',
                              marker_size=0.5,
                              text=[0.45, 0.7, 0.34],
                              textposition='top center',
                              hovertemplate='weight: %{text}<extra></extra>')
    return edge_trace, eweights_trace


def get_node_trace(G):
    node_x = []
    node_y = []
    node_z = []
    for node in G.nodes():
        x, y, z = G.nodes[node]['pos']
        node_x.append(x)
        node_y.append(y)
        node_z.append(z)

    node_trace = go.Scatter3d(
        x=node_x, y=node_y, z=node_z,
        mode='markers',
        marker_size=12,
        #hoverinfo='text', #THIS LINE HAS NO SENSE BECAUSE text WAS NOT DEFINED
        marker_color='RoyalBlue',
        )

    return node_trace


if __name__ == '__main__':

    tail = [1, 2, 3]
    head = [2, 3, 4]

    xpos = [0, 1, 2, 3]
    ypos = [0, 0, 0, 0]
    zpos = [-1, 0, -9, 10]

    w = [1, 2, 3]
    v = [.1, 0.2, 0.3]
    xpos_ypos_zpos = [(x, y, z) for x, y, z in zip(xpos, ypos, zpos)]

    ed_ls = [(x, y) for x, y in zip(tail, head)]
    G = nx.OrderedGraph()
    G.add_edges_from(ed_ls)

    pos = OrderedDict(zip(G.nodes, xpos_ypos_zpos))
    edge_w = OrderedDict(zip(G.edges, w))
    edge_v = OrderedDict(zip(G.edges, v))
    nx.set_node_attributes(G, pos, 'pos')
    nx.set_edge_attributes(G, edge_w, 'weight')
    nx.set_edge_attributes(G, edge_v, 'value')

    # convert to plotly graph
    edge_trace, eweights_trace = get_edge_trace(G)
    node_trace = get_node_trace(G)

    fig = go.Figure(data=[edge_trace, node_trace, eweights_trace],
                    layout=go.Layout(
                        title='<br>Network graph made with Python',
                        titlefont_size=16,
                        showlegend=False,
                        hovermode='closest',
                        margin=dict(b=20, l=5, r=5, t=40),
                        xaxis_visible=False,
                        yaxis_visible=False)
                    )
    fig.write_html('plot.html', auto_open=True)

Unfortunately, I get an error

fig.write_html(‘plot.html’, auto_open=True)
return pio.write_html(self, *args, **kwargs)
fig_dict.get(“data”, ), cls=utils.PlotlyJSONEncoder, sort_keys=True
encoded_o = super(PlotlyJSONEncoder, self).encode(o)…
raise TypeError(f’Object of type {o.class.name} ’
TypeError: Object of type Float is not JSON serializable

I’m not sure why this error occurs. Could someone help me with this?

This is a kind reminder.