• neo4j可视化展示


    查询前端输入的节点,并显示该节点及其下一级节点以及他们之前的关系
    后端

    import json
    from py2neo import *
    from django.shortcuts import render
    
    # 连接数据库
    graph = Graph('http://localhost:7474/', auth=('neo4j', 'root'))
    
    def search_one(value):
        # 定义data数组存储节点信息
        data = []
        # 定义links数组存储关系信息
        links = []
        # 查询节点是否存在
        node = graph.run('MATCH(n:person{name:"' + value + '"}) return n').data()
        # 如果节点存在len(node)的值为1不存在的话len(node)的值为0
        if len(node):
            # 如果该节点存在将该节点存入data数组中
            # 构造字典存放节点信息
            dict = {
                'name': value,
                'symbolSize': 50,
                'category': '对象'
            }
            data.append(dict)
            # 查询与该节点有关的节点,无向,步长为1,并返回这些节点
            nodes = graph.run('MATCH(n:person{name:"' + value + '"})<-->(m:person) return m').data()
            # 查询该节点所涉及的所有relationship,无向,步长为1,并返回这些relationship
            reps = graph.run('MATCH(n:person{name:"' + value + '"})<-[rel]->(m:person) return rel').data()
            # 处理节点信息
            for n in nodes:
                # 将节点信息的格式转化为json
                node = json.dumps(n, ensure_ascii=False)
                node = json.loads(node)
                # 取出节点信息中person的name
                name = str(node['m']['name'])
                # 构造字典存放单个节点信息
                dict = {
                    'name': name,
                    'symbolSize': 50,
                    'category': '对象'
                }
                # 将单个节点信息存储进data数组中
                data.append(dict)
            # 处理relationship
            for r in reps:
                source = str(r['rel'].start_node['name'])
                target = str(r['rel'].end_node['name'])
                name = str(type(r['rel']).__name__)
                dict = {
                    'source': source,
                    'target': target,
                    'name': name
                }
                links.append(dict)
            # 构造字典存储data和links
            search_neo4j_data = {
                'data': data,
                'links': links
            }
            # 将dict转化为json格式
            search_neo4j_data = json.dumps(search_neo4j_data)
            return search_neo4j_data
        else:
            print("查无此人")
            return 0
    
    
    def index(request):
        ctx = {}
        if request.method == 'POST':
            # 接收前端传过来的查询值
            node_name = request.POST.get('node')
            # 查询结果
            search_neo4j_data = search_one(node_name)
            # 未查询到该节点
            if search_neo4j_data == 0:
                ctx = {'title': '数据库中暂未添加该实体'}
            # 查询到了该节点
            else:
                return render(request, 'index.html',{'search_neo4j_data': search_neo4j_data, 'ctx': ctx})
                
        return render(request, 'index.html', {'ctx': ctx})
    

      

    {% 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 style=" 800px;height: 750px;float: right;margin-right: 10px;">
        <div style=" 800px;height: 50px;border-top: 2px solid black;border-left: 2px solid black;border-right: 2px solid black">
            <form action="/" method="post">
                <input type="text" name="node" style=" 250px;height: 20px; margin-top: 10px;margin-left: 20px;">
                <input type="submit" value="查询">
            </form>
        </div>
        {% if ctx %}
            <div style=" 800px;height: 700px;border: 2px solid black;text-align: center;line-height: 704px;">
                <h1>该数据库中未添加该实体</h1>
            </div>
        {% endif %}
        {% if search_neo4j_data %}
            <div id="container_search" style=" 800px;height: 700px;border: 2px solid black"></div>
        {% endif %}
    </div>
    <script type="text/javascript">
        {#查询单个#}
        var search_neo4j_data=[{{ search_neo4j_data|safe }}]
        var data2=search_neo4j_data[0]['data']
        var links2=search_neo4j_data[0]['links']
        console.log(data2)
        console.log(links2)
        var myChart2 = echarts.init(document.getElementById('container_search'));
        var categories2 = [{name: "对象"}, {name: "属性"}, {name: "实例"}];
        option2 = {
            // 图的标题
            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: categories2.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: {
                         2,
                        color: '#4b565b',
                    }
                },
                edgeLabel: {
                    normal: {
                        show: true,
                        formatter: function (x) {
                            return x.data.name;
                        }
                    }
                },
                label: {
                    normal: {
                        show: true,
                        textStyle: {}
                    }
                },
    
                // 数据
                data: data2,
                links: links2,
                categories: categories2,
            }]
        };
        myChart2.setOption(option2);
    
    </script>
    </body>
    </html>
    

      

  • 相关阅读:
    c&c++中的宏
    cmake教程
    什么是Grunt
    npm-install camo
    在node.js中建立你的第一个HTTp服务器
    highChart数据动态更新
    css:before和after中的content属性
    清除float浮动三种方式
    中文标准web字体
    网站桌面端和手机端不同url的设置
  • 原文地址:https://www.cnblogs.com/huaobin/p/16345906.html
Copyright © 2020-2023  润新知