Mercurial > hg > NetworkVis
changeset 13:394bd5cfc508
new commentaries_authors.html visualisation.
author | casties |
---|---|
date | Mon, 05 Oct 2015 18:56:19 +0200 |
parents | d67c5ad47709 |
children | b33f35b57b93 |
files | ismi-python-neo4jrestclient/ismi-vis.py ismi-python-neo4jrestclient/static/commentaries.html ismi-python-neo4jrestclient/static/commentaries_authors.html ismi-python-neo4jrestclient/static/index.html |
diffstat | 4 files changed, 279 insertions(+), 26 deletions(-) [+] |
line wrap: on
line diff
--- a/ismi-python-neo4jrestclient/ismi-vis.py Fri Oct 02 01:08:46 2015 -0400 +++ b/ismi-python-neo4jrestclient/ismi-vis.py Mon Oct 05 18:56:19 2015 +0200 @@ -6,33 +6,39 @@ from neo4jrestclient.client import GraphDatabase, Node, Relationship app = Flask(__name__, static_url_path='/static/') +app.debug = True gdb = GraphDatabase("http://localhost:7474", username="neo4j", password="neo5j") @app.route("/") def get_index(): - return app.send_static_file('index.html') + return app.send_static_file('commentaries.html') @app.route("/commentaries.html") def get_commentaries(): return app.send_static_file('commentaries.html') +@app.route("/commentaries_authors.html") +def get_commentaries_authors(): + return app.send_static_file('commentaries_authors.html') @app.route("/graph") def get_graph(): - query = ("match (t1:TEXT)-[r:is_commentary_on]->(t2:TEXT) return t1,r,t2") - results = gdb.query(query, returns=(Node,Relationship,Node)) + query = ("match (a1:PERSON)<-[:was_created_by]-(t1:TEXT)-[r:is_commentary_on]->(t2:TEXT)-[:was_created_by]->(a2:PERSON)" + " return a1,t1,t2,a2" + " limit 100") + results = gdb.query(query, returns=(Node,Node,Node,Node)) n4j_nodes = {} node_idx = {} nodes = [] rels = [] i = 0 - for node1, rel, node2 in results: - # source node - id1 = node1['ismi_id'] + for author1, text1, text2, author2 in results: + # source text + id1 = text1['ismi_id'] if id1 not in n4j_nodes: - n4j_nodes[id1] = node1 - nodes.append({"title": node1['label'], "label": "TEXT"}) + n4j_nodes[id1] = text1 + nodes.append({"title": "%s [%s]"%(text1['label'],id1), "label": "TEXT"}) node_idx[id1] = i source = i i += 1 @@ -40,11 +46,11 @@ else: source = node_idx[id1] - # target node - id2 = node2['ismi_id'] + # target text + id2 = text2['ismi_id'] if id2 not in n4j_nodes: - n4j_nodes[id2] = node2 - nodes.append({"title": node2['label'], "label": "TEXT"}) + n4j_nodes[id2] = text2 + nodes.append({"title": "%s [%s]"%(text2['label'],id2), "label": "TEXT"}) node_idx[id2] = i target = i i += 1 @@ -52,9 +58,39 @@ else: target = node_idx[id2] - # relation + # relation is_commentary_on rels.append({"source": source, "target": target}) + # source author + id3 = author1['ismi_id'] + if id3 not in n4j_nodes: + n4j_nodes[id3] = author1 + nodes.append({"title": "%s [%s]"%(author1['label'],id3), "label": "PERSON"}) + node_idx[id3] = i + s_author = i + i += 1 + + else: + s_author = node_idx[id3] + + # relation was_created_by + rels.append({"source": source, "target": s_author}) + + # target author + id4 = author1['ismi_id'] + if id4 not in n4j_nodes: + n4j_nodes[id4] = author2 + nodes.append({"title": "%s [%s]"%(author2['label'],id4), "label": "PERSON"}) + node_idx[id4] = i + t_author = i + i += 1 + + else: + t_author = node_idx[id4] + + # relation was_created_by + rels.append({"source": source, "target": t_author}) + return Response(dumps({"nodes": nodes, "links": rels}), mimetype="application/json") @@ -66,15 +102,17 @@ except KeyError: return [] else: - query = ("MATCH (text:TEXT) " - "WHERE text.label =~ {title} " - "RETURN text") + query = ("MATCH (t:TEXT)-[:was_created_by]->(p:PERSON) " + "WHERE p.ismi_id = {id} " + "RETURN t,p") results = gdb.query( query, - returns=Node, - params={"title": "(?i).*" + q + ".*"} + returns=(Node,Node), + params={"id": int(q)} ) - return Response(dumps([{"text": row.properties} for [row] in results]), + # {"name": "(?i).*" + q + ".*"} + print("search for %s returned %s results"%(repr(q),len(results))) + return Response(dumps([{"text": text.properties, "author": author.properties} for [text,author] in results]), mimetype="application/json") @@ -89,6 +127,33 @@ return Response(dumps({"title": node['label'], "attrs": node.properties}), mimetype="application/json") +@app.route("/textandcommentaries/<text_id>") +def get_textandcommentaries(text_id): + query = ("match (t:TEXT {ismi_id:{text_id}})" + " optional match (s:TEXT)<-[sr:is_commentary_on]-(t)" + " optional match (t)<-[cr:is_commentary_on]-(c:TEXT)" + " return t,s.label, s.ismi_id,c.label,c.ismi_id") + print("query:%s"%query) + results = gdb.query(query, returns=(Node,str,str,str,str), + params={"text_id": int(text_id)}) + + print("result:%s"%results) + text = None + scs = {} + cs = {} + for [t,s_label,s_id,c_label,c_id] in results: + text = t + if s_id is not None and s_id != "None": + scs[int(s_id)] = s_label + + if c_id is not None and c_id != "None": + cs[int(c_id)] = c_label + + print("text:%s scs:%s cs:%s"%(text, scs, cs)) + return Response(dumps({"title": text['label'], "attrs": text.properties, + "commenting": scs, "commentaries": cs}), + mimetype="application/json") + if __name__ == '__main__': app.run(port=8080)
--- a/ismi-python-neo4jrestclient/static/commentaries.html Fri Oct 02 01:08:46 2015 -0400 +++ b/ismi-python-neo4jrestclient/static/commentaries.html Mon Oct 05 18:56:19 2015 +0200 @@ -81,9 +81,10 @@ <!-- <script src="https://d3js.org/d3.v3.min.js" type="text/javascript"></script> --> <script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" type="text/javascript"></script> <script type="text/javascript"> + backendApiPrefix = ""; $(function () { function showMovie(text_id) { - $.get("/netvis-ismi/text/" + encodeURIComponent(text_id), + $.get(backendApiPrefix+"/text/" + encodeURIComponent(text_id), function (data) { if (!data) return; $("#title").text(data.title); @@ -101,7 +102,7 @@ } function search() { var query=$("#search").find("input[name=search]").val(); - $.get("/netvis-ismi/search?q=" + encodeURIComponent(query), + $.get(backendApiPrefix+"/search?q=" + encodeURIComponent(query), function (data) { var t = $("table#results tbody").empty(); if (!data || data.length == 0) return; @@ -130,7 +131,7 @@ .attr("width", "100%").attr("height", "100%") .attr("pointer-events", "all"); - d3.json("/netvis-ismi/graph", function(error, graph) { + d3.json(backendApiPrefix+"/graph", function(error, graph) { if (error) return; force.nodes(graph.nodes).links(graph.links).start();
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/ismi-python-neo4jrestclient/static/commentaries_authors.html Mon Oct 05 18:56:19 2015 +0200 @@ -0,0 +1,185 @@ +<html> +<head> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <link rel="stylesheet" href="//neo4j-contrib.github.io/developer-resources/language-guides/assets/css/main.css"> + <title>ISMI commentary relations</title> +</head> + +<body style="background:none;"> +<div id="graph"> +</div> +<div role="navigation" class="navbar navbar-default navbar-static-top"> + <div class="container"> + <div class="row"> + <div class="col-sm-6 col-md-6"> + <ul class="nav navbar-nav"> + <li> + <form role="search" class="navbar-form" id="search"> + <div class="form-group"> + <input type="text" value="tusi" placeholder="Search for Title" class="form-control" name="search"> + </div> + <button class="btn btn-default" type="submit">Search</button> + </form> + </li> + </ul> + </div> + <div class="navbar-header col-sm-6 col-md-6"> + <div class="logo-well"> + <a href="//neo4j.com/developer-resources"> + <img src="//neo4j-contrib.github.io/developer-resources/language-guides/assets/img/logo-white.svg" alt="Neo4j World's Leading Graph Database" id="logo"> + </a> + </div> + <div class="navbar-brand"> + <div class="brand">ISMI Commentary relations between Texts</div> + </div> + </div> + </div> + </div> +</div> + +<div class="row"> + <div class="col-md-5"> + <div class="panel panel-default"> + <div class="panel-heading">Search Results</div> + <table id="results" class="table table-striped table-hover"> + <thead> + <tr> + <th>Title (translit)</th> + <th>Title (arabic)</th> + <th>ismi_id</th> + </tr> + </thead> + <tbody> + </tbody> + </table> + </div> + </div> + <div class="col-md-7"> + <div class="panel panel-default"> + <div class="panel-heading" id="title">Details</div> + <div class="row"> + <!-- <div class="col-sm-4 col-md-4"> + <img src="" class="well" id="poster"/> + </div> --> + <div class="col-md-8 col-sm-8"> + <h4>Details</h4> + <ul id="info"> + </ul> + <h4>Commenting on</h4> + <ul id="commenting"> + </ul> + <h4>Commentaries</h4> + <ul id="commentaries"> + </ul> + </div> + </div> + </div> + </div> +</div> +<style type="text/css"> + .node { stroke: #222; stroke-width: 1.5px; } + .node.TEXT { fill: #888; } + .node.movie { fill: #BBB; } + .link { stroke: #999; stroke-opacity: .6; stroke-width: 1px; } +</style> + +<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script> +<!-- <script src="https://d3js.org/d3.v3.min.js" type="text/javascript"></script> --> +<script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" type="text/javascript"></script> +<script type="text/javascript"> + backendApiPrefix = ""; + $(function () { + function showText(text_id) { + $.get(backendApiPrefix+"/textandcommentaries/" + encodeURIComponent(text_id), + function (data) { + if (!data) return; + $("#title").text(data.title); + var $list = $("#info").empty(); + for (var key in data.attrs) { + var val = data.attrs[key]; + if (key === "link") { + val = "<a href=\"" + val + "\" target=\"_blank\">" + val + "</a>"; + } + $list.append($("<li>" + key + ": " + val + "</li>")); + }; + var $commentaries = $("#commentaries").empty(); + for (var key in data.commentaries) { + var val = data.commentaries[key]; + $commentaries.append($("<li>" + val + " [<span class=\"text_id\">" + key + "</span>]" + "</li>") + .click(function() { showText($(this).find("span.text_id").text());})); + } + var $commenting = $("#commenting").empty(); + for (var key in data.commenting) { + var val = data.commenting[key]; + $commenting.append($("<li>" + val + " [<span class=\"text_id\">" + key + "</span>]" + "</li>") + .click(function() { showText($(this).find("span.text_id").text());})); + } + }, "json"); + return false; + } + function search() { + var query=$("#search").find("input[name=search]").val(); + $.get(backendApiPrefix+"/search?q=" + encodeURIComponent(query), + function (data) { + var t = $("table#results tbody").empty(); + if (!data || data.length == 0) return; + data.forEach(function (row) { + var text = row.text; + var author = row.author; + $("<tr><td>" + author.label + "</td><td>" + text.label + "</td><td>" + text.full_title + "</td><td class='text_id'>" + text.ismi_id + "</td></tr>").appendTo(t) + .click(function() { showText($(this).find("td.text_id").text());}) + }); + showText(data[0].text.ismi_id); + }, "json"); + return false; + } + + $("#search").submit(search); + search(); + }) +</script> + +<script type="text/javascript"> + var width = 800, height = 800; + + var force = d3.layout.force() + .charge(-200).linkDistance(30).size([width, height]); + + var svg = d3.select("#graph").append("svg") + .attr("width", "100%").attr("height", "100%") + .attr("pointer-events", "all"); + + d3.json(backendApiPrefix+"/graph", function(error, graph) { + if (error) return; + + force.nodes(graph.nodes).links(graph.links).start(); + + var link = svg.selectAll(".link") + .data(graph.links).enter() + .append("line").attr("class", "link"); + + var node = svg.selectAll(".node") + .data(graph.nodes).enter() + .append("circle") + .attr("class", function (d) { return "node "+d.label }) + .attr("r", 10) + .call(force.drag); + + // html title attribute + node.append("title") + .text(function (d) { return d.title; }) + + // force feed algo ticks + force.on("tick", function() { + link.attr("x1", function(d) { return d.source.x; }) + .attr("y1", function(d) { return d.source.y; }) + .attr("x2", function(d) { return d.target.x; }) + .attr("y2", function(d) { return d.target.y; }); + + node.attr("cx", function(d) { return d.x; }) + .attr("cy", function(d) { return d.y; }); + }); + }); +</script> +</body> +</html>
--- a/ismi-python-neo4jrestclient/static/index.html Fri Oct 02 01:08:46 2015 -0400 +++ b/ismi-python-neo4jrestclient/static/index.html Mon Oct 05 18:56:19 2015 +0200 @@ -44,6 +44,7 @@ <table id="results" class="table table-striped table-hover"> <thead> <tr> + <th>Author (translit)</th> <th>Title (translit)</th> <th>Title (arabic)</th> <th>ismi_id</th> @@ -73,7 +74,7 @@ <style type="text/css"> .node { stroke: #222; stroke-width: 1.5px; } .node.TEXT { fill: #888; } - .node.movie { fill: #BBB; } + .node.PERSON { fill: #BBB; } .link { stroke: #999; stroke-opacity: .6; stroke-width: 1px; } </style> @@ -81,9 +82,10 @@ <!-- <script src="https://d3js.org/d3.v3.min.js" type="text/javascript"></script> --> <script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" type="text/javascript"></script> <script type="text/javascript"> + backendApiPrefix = ""; $(function () { function showMovie(text_id) { - $.get("/netvis-ismi/text/" + encodeURIComponent(text_id), + $.get(backendApiPrefix+"/text/" + encodeURIComponent(text_id), function (data) { if (!data) return; $("#title").text(data.title); @@ -97,7 +99,7 @@ } function search() { var query=$("#search").find("input[name=search]").val(); - $.get("/netvis-ismi/search?q=" + encodeURIComponent(query), + $.get(backendApiPrefix+"/search?q=" + encodeURIComponent(query), function (data) { var t = $("table#results tbody").empty(); if (!data || data.length == 0) return; @@ -126,7 +128,7 @@ .attr("width", "100%").attr("height", "100%") .attr("pointer-events", "all"); - d3.json("/netvis-ismi/graph", function(error, graph) { + d3.json(backendApiPrefix"/graph", function(error, graph) { if (error) return; force.nodes(graph.nodes).links(graph.links).start();