neo4j可视化展示
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="{% static 'echarts.min.js' %}"></script>
</head>
<body>
<div id="container" style="width: 800px;height: 700px;border: 2px solid black;float: left;margin-top: 50px;"></div>
<script type="text/javascript">
{#查询所有#}
var neo4j_data = [{{ neo4j_data|safe }}]
var data1 = neo4j_data[0]['data']
var links1 = neo4j_data[0]['links']
console.log(data1)
console.log(links1)
var myChart1 = echarts.init(document.getElementById('container'));
var categories1 = [{name: "对象"}, {name: "属性"}, {name: "实例"}];
option1 = {
// 图的标题
title: {
text: '三国人物关系图谱'
},
// 提示框的配置
tooltip: {
formatter: function (x) {
return x.data.des;
}
},
// 工具箱
toolbox: {
// 显示工具箱
show: true,
feature: {
mark: {
show: true
},
// 还原
restore: {
show: true
},
// 保存为图片
saveAsImage: {
show: true
}
}
},
legend: [{
// selectedMode: 'single',
data: categories1.map(function (a) {
return a.name;
})
}],
series: [{
type: 'graph', // 类型:关系图
layout: 'force', //图的布局,类型为力导图
symbolSize: 40, // 调整节点的大小
roam: true, // 是否开启鼠标缩放和平移漫游。默认不开启。如果只想要开启缩放或者平移,可以设置成 'scale' 或者 'move'。设置成 true 为都开启
edgeSymbol: ['circle', 'arrow'],
edgeSymbolSize: [2, 10],
edgeLabel: {
normal: {
textStyle: {
fontSize: 20
}
}
},
force: {
repulsion: 2500,
edgeLength: [10, 50]
},
draggable: true,
lineStyle: {
normal: {
width: 2,
color: '#4b565b',
}
},
edgeLabel: {
normal: {
show: true,
formatter: function (x) {
return x.data.name;
}
}
},
label: {
normal: {
show: true,
textStyle: {}
}
},
// 数据
data: data1,
links: links1,
categories: categories1,
}]
};
myChart1.setOption(option1);
</script>
</body>
</html>
https://blog.csdn.net/weixin_44747173/article/details/124835406?spm=1001.2101.3001.6650.16&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7Edefault-16-124835406-blog-124194577.pc_relevant_antiscanv4&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromBaidu%7Edefault-16-124835406-blog-124194577.pc_relevant_antiscanv4&utm_relevant_index=20
利用Echarts将后端获取的neo4j中的图谱数据显示在前端界面
文章包括四部分内容:
①利用python创建图数据库
②查询neo4j中所有的节点和关系并显示在前端
③查询前端输入的节点,并显示该节点及其下一级节点以及他们之前的关系
④将查询所有和查询单个合并
一、利用python创建图数据库
1、启动neo4j
在cmd中输入neo4j.bat console
2、安装py2neo
在pycharm的命令窗口输入pip install py2neo
3、创建数据
import py2neo
# 连接数据库
graph = py2neo.Graph('http://localhost:7474', auth=('neo4j', 'root'))
def creat():
# 创建节点
lb = py2neo.Node('person', name='刘备')
gy = py2neo.Node('person', name='关羽')
zgl = py2neo.Node('person', name='诸葛亮')
cc = py2neo.Node('person', name='曹操')
xhd = py2neo.Node('person', name='夏侯惇')
sq = py2neo.Node('person', name='孙权')
sc = py2neo.Node('person', name='孙策')
zy = py2neo.Node('person', name='周瑜')
graph.create(lb)
graph.create(gy)
graph.create(zgl)
graph.create(cc)
graph.create(xhd)
graph.create(sq)
graph.create(sc)
graph.create(zy)
r1 = py2neo.Relationship(lb, '兄弟', gy)
r2 = py2neo.Relationship(lb, '属下', zgl)
r3 = py2neo.Relationship(lb, '大舅哥+敌对', sc)
r4 = py2neo.Relationship(lb, '二舅哥+敌对', sq)
r5 = py2neo.Relationship(lb, '敌对', cc)
r6 = py2neo.Relationship(cc, '属下', xhd)
r7 = py2neo.Relationship(sq, '兄弟', sc)
r8 = py2neo.Relationship(sq, '属下', zy)
graph.create(r1)
graph.create(r2)
graph.create(r3)
graph.create(r4)
graph.create(r5)
graph.create(r6)
graph.create(r7)
graph.create(r8)
if __name__ == '__main__':
creat()
二、查询所有节点和关系并显示在前端
1、引入echarts
echarts的引入并不复杂,详情见此处
2、查询所有节点和关系
后端
import json
from py2neo import *
from django.shortcuts import render
# 连接数据库
graph = Graph('http://localhost:7474/', auth=('neo4j', 'root'))
def search_all():
# 定义data数组,存放节点信息
data = []
# 定义关系数组,存放节点间的关系
links = []
# 查询所有节点,并将节点信息取出存放在data数组中
for n in graph.nodes:
# 将节点信息转化为json格式,否则中文会不显示
nodesStr = json.dumps(graph.nodes[n], ensure_ascii=False)
# 取出节点的name
node_name = json.loads(nodesStr)['name']
# 构造字典,存储单个节点信息
dict = {
'name': node_name,
'symbolSize': 50,
'category': '对象'
}
# 将单个节点信息存放在data数组中
data.append(dict)
# 查询所有关系,并将所有的关系信息存放在links数组中
rps = graph.relationships
for r in rps:
# 取出开始节点的name
source = str(rps[r].start_node['name'])
# 取出结束节点的name
target = str(rps[r].end_node['name'])
# 取出开始节点的结束节点之间的关系
name = str(type(rps[r]).__name__)
# 构造字典存储单个关系信息
dict = {
'source': source,
'target': target,
'name': name
}
# 将单个关系信息存放进links数组中
links.append(dict)
# 输出所有节点信息
for item in data:
print(item)
# 输出所有关系信息
for item in links:
print(item)
# 将所有的节点信息和关系信息存放在一个字典中
neo4j_data = {
'data': data,
'links': links
}
#将字典转化json格式
neo4j_data = json.dumps(neo4j_data)
return neo4j_data
def index(request):
neo4j_data = search_all()
return render(request, 'index.html', {'neo4j_data': neo4j_data})
`

浙公网安备 33010602011771号