Skip to content

gargantext
gargantext
Commit 0d3dedb9 authored by Mathieu Rodic's avatar Mathieu Rodic
Browse files
Options

[FEATURE] Started working on the implementation of the charts interface

parent 99bc46fb
Show whitespace changes
Inline Side-by-side
Showing with 209 additions and 52 deletions
gargantext_web/api.py
View file @ 0d3dedb9
......@@ -168,21 +168,64 @@ class CorpusController:
corpus = cls.get(corpus_id)
# query building
cursor = connection.cursor()
cursor.execute(_sql_cte + '''
SELECT key
# cursor.execute(_sql_cte + '''
# SELECT key
# FROM (
# SELECT skeys(metadata) AS key, COUNT(*)
# FROM cte
# INNER JOIN %s AS node ON node.id = cte.id
# WHERE (NOT cte.id = \'%d\') AND (\'%d\' = ANY(cte."path"))
# ) AS keys
# GROUP BY key
# ORDER BY COUNT(*) DESC
# ''' % (Node._meta.db_table, corpus.id, corpus.id, ))
cursor.execute('''
SELECT key, COUNT(*) AS count, (
SELECT COUNT(DISTINCT metadata->key) FROM %s
) AS values
FROM (
SELECT skeys(metadata) AS key
FROM cte
INNER JOIN %s AS node ON node.id = cte.id
WHERE (NOT cte.id = \'%d\') AND (\'%d\' = ANY(cte."path"))
FROM %s
WHERE parent_id = \'%d\'
) AS keys
GROUP BY key
ORDER BY COUNT(*) DESC
''' % (Node._meta.db_table, corpus.id, corpus.id, ))
ORDER BY count DESC
''' % (Node._meta.db_table, Node._meta.db_table, corpus.id, ))
# response building
return JsonHttpResponse({
"list" : [row[0] for row in cursor.fetchall()],
collection = []
for row in cursor.fetchall():
type = 'string'
key = row[0]
split_key = key.split('_')
name = split_key[0]
if len(split_key) == 2:
if split_key[1] == 'date':
name = split_key[0]
type = 'datetime'
elif row[0] == 'language_fullname':
name = 'language'
type = 'string'
else:
continue
values = None
if row[2] < 32:
cursor.execute('''
SELECT DISTINCT metadata->'%s'
FROM %s
WHERE parent_id = %s
AND metadata ? '%s'
ORDER BY metadata->'%s'
''' % (key, Node._meta.db_table, corpus.id, key, key, ))
values = [row[0] for row in cursor.fetchall()]
collection.append({
'key': key,
'text': name,
'documents': row[1],
'valuesCount': row[2],
'values': values,
'type': type,
})
return JsonHttpResponse(collection)
@classmethod
def data(cls, request, corpus_id):
......
static/js/charts/dygraph-combined.js 0 → 100644
View file @ 0d3dedb9
This source diff could not be displayed because it is too large. You can view the blob instead.
static/js/graph-it.js
View file @ 0d3dedb9
......@@ -203,39 +203,143 @@
})(jQuery);
var projectId = 13409;
$('.tree').jstree({
'core' : {
'data' : {
'url' : function(node) {
var url = '/api/nodes?' + ((node.id === '#')
? 'type=Project'
: ('parent=' + node.id)
);
console.log(url);
return url;
},
},
},
"plugins" : ["types"],
"types" : {
"#" : {
"max_children" : 1,
"max_depth" : 4,
"valid_children" : ["root"]
},
"Project" : {
"icon" : "http://www.jstree.com/static/3.0.8/assets/images/tree_icon.png",
"valid_children" : ["default"]
},
"Corpus" : {
"valid_children" : ["default","file"]
},
"Document" : {
"icon" : "glyphicon glyphicon-file",
"valid_children" : []
var selectProject = $('<select>').appendTo('.visualization');
var selectCorpus = $('<select>').appendTo('.visualization');
var divFilter = $('<div>').appendTo('.visualization');
// Load projects
$.get('/api/nodes', {type:'Project'}, function(collection) {
selectProject.empty();
for (var i=0; i<collection.length; i++) {
var node = collection[i];
$('<option>').val(node.id).text(node.text).appendTo(selectProject);
}
},
selectProject.change();
});
// Load corpora
selectProject.change(function() {
var projectId = selectProject.val();
selectCorpus.empty();
$.get('/api/nodes', {type:'Corpus', parent:projectId}, function(collection) {
$.each(collection, function(i, node) {
$('<option>').val(node.id).text(node.text).appendTo(selectCorpus);
});
selectCorpus.change();
});
});
// Load metadata
selectCorpus.change(function() {
var corpusId = selectCorpus.val();
// alert(corpusId);
divFilter.empty();
//
$.get('/api/corpus/' + corpusId + '/metadata', function(collection) {
var selectType = $('<select>').appendTo(divFilter);
//
$('<option>').text('ngrams').appendTo(selectType);
var spanNgrams = $('<span>').appendTo(divFilter).hide();
var inputNgrams = $('<input>').appendTo(spanNgrams);
//
$('<option>').text('metadata').appendTo(selectType);
var spanMetadata = $('<span>').appendTo(divFilter).hide();
var selectMetadata = $('<select>').appendTo(spanMetadata);
var spanMetadataValue = $('<span>').appendTo(spanMetadata);
$.each(collection, function(i, metadata) {
$('<option>')
.data(metadata)
.text(metadata.text)
.appendTo(selectMetadata);
});
//
selectMetadata.change(function() {
var metadata = selectMetadata.find(':selected').data();
spanMetadataValue.empty();
if (metadata.type == 'datetime') {
$('<span>').text(' between: ').appendTo(spanMetadataValue);
$('<input>').appendTo(spanMetadataValue)
.blur(function() {
var input = $(this);
var date = input.val();
date += '2000-01-01'.substr(date.length);
input.val(date);
}).datepicker({dateFormat: 'yy-mm-dd'});
$('<span>').text(' and: ').appendTo(spanMetadataValue);
$('<input>').appendTo(spanMetadataValue)
.blur(function() {
var input = $(this);
var date = input.val();
date += '2000-01-01'.substr(date.length);
input.val(date);
}).datepicker({dateFormat: 'yy-mm-dd'});
} else if (metadata.values) {
$('<span>').text(' is: ').appendTo(spanMetadataValue);
var selectMetadataValue = $('<select>').appendTo(spanMetadataValue);
$.each(metadata.values, function(i, value) {
$('<option>').text(value).appendTo(selectMetadataValue);
});
selectMetadataValue.change().focus();
} else {
$('<span>').text(' contains: ').appendTo(spanMetadataValue);
$('<input>').appendTo(spanMetadataValue).focus();
}
});
//
selectType.change(function() {
divFilter.children().filter('span').hide();
switch (selectType.val()) {
case 'ngrams':
spanNgrams.show();
break;
case 'metadata':
spanMetadata.show();
break;
}
}).change();
});
});
// $('.tree').jstree({
// 'core' : {
// 'data' : {
// 'url' : function(node) {
// var url = '/api/nodes?' + ((node.id === '#')
// ? 'type=Project'
// : ('parent=' + node.id)
// );
// console.log(url);
// return url;
// },
// },
// },
// "plugins" : ["types"],
// "types" : {
// "#" : {
// "max_children" : 1,
// "max_depth" : 4,
// "valid_children" : ["root"]
// },
// "Project" : {
// "icon" : "http://www.jstree.com/static/3.0.8/assets/images/tree_icon.png",
// "valid_children" : ["default"]
// },
// "Corpus" : {
// "valid_children" : ["default","file"]
// },
// "Document" : {
// "icon" : "glyphicon glyphicon-file",
// "valid_children" : []
// }
// },
// });
// var graph = $('.graph-it').graphIt(640, 480);
\ No newline at end of file
templates/graph-it.html
View file @ 0d3dedb9
{% extends "menu.html" %}
{% block css %}
{% load staticfiles %}
<!-- {% load staticfiles %} -->
<link rel="stylesheet" href="{% static "css/bootstrap.css" %}">
<link rel="stylesheet" href="{% static "css/bootstrap-theme.min.css" %}">
<link rel="stylesheet" type="text/css" href="http://jun9.github.io/dc.js/css/dc.css" />
{% endblock %}
......@@ -17,16 +13,28 @@
<p>A web platform to explore text-mining</p>
</div>
</div>
<div class="container visualization"></div>
<div class="container tree"></div>
<div class="container graph-it"></div>
<script type="text/javascript" src="{% static "js/jquery/jquery.min.js" %}"></script>
<!-- <script type="text/javascript" src="{% static "js/jquery/jquery.min.js" %}"></script> -->
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/jstree/3.0.4/themes/default/style.min.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/jstree/3.0.4/jstree.min.js"></script>
<!--
<script type="text/javascript" src="{% static "js/jquery/jquery-1.9.1.min.js" %}"></script>
<link rel="stylesheet" type="text/css" href="https://raw.githubusercontent.com/xdan/datetimepicker/master/jquery.datetimepicker.css"/ >
<script type="text/javascript" src="{% static "js/jquery/jquery.datetimepicker.js" %}"></script>
-->
<script type="text/javascript" src="http://dygraphs.com/dygraph-combined.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">
<script type="text/javascript" src="//code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript" src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<!--
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/jstree/3.0.4/themes/default/style.min.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/jstree/3.0.4/jstree.min.js"></script>
-->
<script type="text/javascript" src="{% static "js/charts/dygraph-combined.js" %}"></script>
<script type="text/javascript" src="{% static "js/graph-it.js" %}"></script>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment