在 Dash/Plotly 中显示属性会导致 KeyError

我正在尝试可视化文档中的引用。为此，我有Elements.csv，看起来像这样：

Doc,Description,DocumentID
SOP Laboratory,This SOP should be used in the lab,10414
Visual Design,Basics for Visual Design,1200139348
GMP,Good Manufacturing Practises,4638261
Windows PC manual,This manual describes how to use Windows PCs,271922

In Connections.csv，我有参考资料：

Source,Target
SOP Laboratory,Windows PC manual
SOP Laboratory,GMP
Visual Design,Windows PC manual

IE。有一个参考SOP Laboratory，这指向Windows PC manual, etc.

我用来可视化该网络的代码适用于 Dash/Plotly：

import pandas as pd
import networkx as nx
import plotly.graph_objs as go
import plotly
import dash
import dash_core_components as dcc
import dash_html_components as html

## Dash setup

external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']
app = dash.Dash(__name__, external_stylesheets=external_stylesheets)


## Data

edges = pd.read_csv('Connections.csv', encoding="utf8")
nodes = pd.read_csv('Elements.csv', encoding="utf8")


## Graph

G = nx.from_pandas_edgelist(edges, 'Source', 'Target')
nx.set_node_attributes(G, nodes.set_index('Doc')['Description'].to_dict(), 'Description')
nx.set_node_attributes(G, nodes.set_index('Doc')['DocumentID'].to_dict(), 'DocumentID')

pos = nx.spring_layout(G)

for node in G.nodes:
    G.nodes[node]['pos'] = list(pos[node])

traceRecode = []

index = 0
for edge in G.edges:
    x0, y0 = G.nodes[edge[0]]['pos']
    x1, y1 = G.nodes[edge[1]]['pos']
    trace = go.Scatter(x=tuple([x0, x1, None]), y=tuple([y0, y1, None]),
                        mode='lines',
                        hoverinfo='none',
                        line={'width': 2},
                        marker=dict(color='#000000'),
                        line_shape='spline',
                        opacity=1)
    traceRecode.append(trace)
    index = index + 1

node_trace = go.Scatter(
    x=[],
    y=[],
    hovertext=[],
    text=[],
    mode='markers+text',
    textposition="bottom center",
    hoverinfo='text',
    marker=dict(
        showscale=True,
        colorscale='Agsunset',
        reversescale=True,
        color=[],
        size=20,
        colorbar=dict(
            thickness=15,
            title='Node Connections',
            xanchor='left',
            titleside='right'
        ),
        line=dict(width=0)))

index = 0
for node in G.nodes():
    x, y = G.nodes[node]['pos']
    # hovertext = "Document Name: " + str(G.nodes[node]['Doc']) + "<br>" + "Document ID: " + str(G.nodes[node]['DocumentID'])
    # text = nodes['Doc'][index]
    node_trace['x'] += tuple([x])
    node_trace['y'] += tuple([y])
    # node_trace['hovertext'] += tuple([hovertext])
    # node_trace['text'] += tuple([text])
    index = index + 1

for node, adjacencies in enumerate(G.adjacency()):
    node_trace['marker']['color']+=tuple([len(adjacencies[1])])
    node_info = adjacencies[0] #+ ' (' +str(adjacencies[1]) + ')' #+' (' +str(len(adjacencies[1])) + ' connections)'
    node_trace['text']+=tuple([node_info])

traceRecode.append(node_trace)

figure = {
    "data": traceRecode,
    "layout": go.Layout(title='Document Overview', showlegend=False, hovermode='closest',
                        margin={'b': 40, 'l': 40, 'r': 40, 't': 40},
                        xaxis={'showgrid': False, 'zeroline': False, 'showticklabels': False},
                        yaxis={'showgrid': False, 'zeroline': False, 'showticklabels': False},
                        height=1000,
                        clickmode='event+select',
                        annotations=[
                            dict(
                                ax=(G.nodes[edge[0]]['pos'][0] + G.nodes[edge[1]]['pos'][0]) / 2,
                                ay=(G.nodes[edge[0]]['pos'][1] + G.nodes[edge[1]]['pos'][1]) / 2, axref='x', ayref='y',
                                x=(G.nodes[edge[1]]['pos'][0] * 3 + G.nodes[edge[0]]['pos'][0]) / 4,
                                y=(G.nodes[edge[1]]['pos'][1] * 3 + G.nodes[edge[0]]['pos'][1]) / 4, xref='x', yref='y',
                                showarrow=True,
                                arrowhead=4,
                                arrowsize=2,
                                arrowwidth=1,
                                opacity=1
                            ) for edge in G.edges]
                        )}

app.layout = html.Div([
    dcc.Graph(figure=figure
    ),
])

if __name__ == '__main__':
    app.run_server(debug=True)

我从中找到了这段代码Github 仓库 https://github.com/jhwang1992/network-visualization.

这导致：错误的箭头 https://i.stack.imgur.com/9c0ut.png

然而，错误的方向是错误的。 （正确方向请参见红色箭头。）

我想要实现的是这个（来自 Github 存储库的“Bob”和“Type1”），即当鼠标悬停在节点上时显示文档名称、描述和 ID：目标属性 https://i.stack.imgur.com/jLSs0.png

但是，当我注释掉这些行时，就像这样

index = 0
for node in G.nodes():
    x, y = G.nodes[node]['pos']
    hovertext = "Document Name: " + str(G.nodes[node]['Doc']) + "<br>" + "Document ID: " + str(G.nodes[node]['DocumentID'])
    text = nodes['Doc'][index]
    node_trace['x'] += tuple([x])
    node_trace['y'] += tuple([y])
    node_trace['hovertext'] += tuple([hovertext])
    node_trace['text'] += tuple([text])
    index = index + 1

# for node, adjacencies in enumerate(G.adjacency()):
#     node_trace['marker']['color']+=tuple([len(adjacencies[1])])
#     node_info = adjacencies[0] #+ ' (' +str(adjacencies[1]) + ')' #+' (' +str(len(adjacencies[1])) + ' connections)'
#     node_trace['text']+=tuple([node_info])

但是，这会导致错误：

Traceback (most recent call last):
  File "C:\Users\rothstem\Desktop\LearnDash\StackEX\app.py", line 73, in <module>
    hovertext = "Document Name: " + str(G.nodes[node]['Doc']) + "<br>" + "Document ID: " + str(G.nodes[node]['DocumentID'])
KeyError: 'Doc'

我不太明白，因为'Doc'定义如上。

在创建图表期间，您创建了节点属性"Description":

nx.set_node_attributes(G, nodes.set_index('Doc')['Description'].to_dict(), 'Description')

所以你只需要更换"Doc" with "Description":

hovertext = "Document Name: " + str(G.nodes[node]['Description']) + "<br>" + "Document ID: " + str(G.nodes[node]['DocumentID'])