Commit 32c95663 authored by Fabien  MAREUIL's avatar Fabien MAREUIL
Browse files

gradiant legend

parent 09d83eac
Pipeline #47201 passed with stages
in 22 minutes and 59 seconds
...@@ -194,3 +194,16 @@ a.infobulle:hover span, a.infobulle:focus span{ ...@@ -194,3 +194,16 @@ a.infobulle:hover span, a.infobulle:focus span{
transform:scale(1) rotate(0); transform:scale(1) rotate(0);
opacity:1; opacity:1;
} }
table.gradiant{
width:inherit;
table-layout: fixed;
height:50px;
}
table.gradiant td{
overflow: visible;
border-right: none;
white-space: nowrap;
text-align: left;
}
\ No newline at end of file
...@@ -410,7 +410,7 @@ function loadNGL(url, callback){ ...@@ -410,7 +410,7 @@ function loadNGL(url, callback){
hasinteract = 1; hasinteract = 1;
var labelsliderinterac = createElement("label", {}, {}, "", {'for':'isolevel' + chain.pdb_chain_id}); var labelsliderinterac = createElement("label", {}, {}, "", {'for':'isolevel' + chain.pdb_chain_id});
labelsliderinterac.innerHTML = 'Adjust predictive interactibility surface on ' + chain.pdb_chain_id; labelsliderinterac.innerHTML = 'Adjust predictive interactibility surface on chain ' + chain.pdb_chain_id;
divchain.appendChild(labelsliderinterac); divchain.appendChild(labelsliderinterac);
divchain.appendChild(createElement('br')); divchain.appendChild(createElement('br'));
var divdropdowninterac = createElement("div",{},{},"dropdown"); var divdropdowninterac = createElement("div",{},{},"dropdown");
...@@ -491,7 +491,7 @@ function loadNGL(url, callback){ ...@@ -491,7 +491,7 @@ function loadNGL(url, callback){
var labelslider = createElement("label", {}, {}, "", {'for':'isolevel' + chain.pdb_chain_id}); var labelslider = createElement("label", {}, {}, "", {'for':'isolevel' + chain.pdb_chain_id});
labelslider.innerHTML = 'Adjust predictive surface druggable on ' + chain.pdb_chain_id; labelslider.innerHTML = 'Adjust predictive surface druggable on chain ' + chain.pdb_chain_id;
var divvalueslider = createElement("div", {}, {}, "", {'id': 'valueisolevel' + chain.pdb_chain_id}); var divvalueslider = createElement("div", {}, {}, "", {'id': 'valueisolevel' + chain.pdb_chain_id});
divvalueslider.innerHTML = 'current value: 0.7' divvalueslider.innerHTML = 'current value: 0.7'
divchainmrc.appendChild(labelslider); divchainmrc.appendChild(labelslider);
......
{% extends "base.html" %} {% extends "base.html" %}
{% load humanize %}
{% load customtags %} {% load customtags %}
{% load static %} {% load static %}
{% block title %}Target Centric view{% endblock %} {% block title %}Target Centric view{% endblock %}
...@@ -142,19 +143,41 @@ ...@@ -142,19 +143,41 @@
</div> </div>
</div> </div>
<div class="card"> <div class="card">
<div class="card-title text-center"> <div class="card-title">
<a class="infobulle" href='#'> <div class="row text-center mt-3">
<i class="fas fa-question-circle fa-2x"></i> <div class="col-12">
<span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas pulvinar ornare hendrerit. <a class="infobulle" href='#'>
Phasellus urna neque, vehicula in eleifend ut, aliquam quis nunc. Nam dapibus lobortis nulla id faucibus. <i class="fas fa-question-circle fa-2x"></i>
Morbi rhoncus libero at lectus iaculis sagittis. Phasellus egestas enim odio, porta lobortis neque sodales <span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas pulvinar ornare hendrerit.
vitae. Fusce molestie posuere ultricies. Sed interdum ipsum vel metus condimentum, ac vehicula enim molestie. Phasellus urna neque, vehicula in eleifend ut, aliquam quis nunc. Nam dapibus lobortis nulla id faucibus.
Nunc pharetra tortor ullamcorper lacinia viverra. Pellentesque in tempor mauris. Integer convallis urna a Morbi rhoncus libero at lectus iaculis sagittis. Phasellus egestas enim odio, porta lobortis neque sodales
ligula ultricies venenatis. Duis ut congue magna. </span> vitae. Fusce molestie posuere ultricies. Sed interdum ipsum vel metus condimentum, ac vehicula enim molestie.
</a> Nunc pharetra tortor ullamcorper lacinia viverra. Pellentesque in tempor mauris. Integer convallis urna a
<strong>Cavities</strong> ligula ultricies venenatis. Duis ut congue magna. </span>
<small>For information, a Zscore is given when you mouseover a cavity name. If its value is greater than {{ avg_std|get_zscore_threshold }} (-2 x the standard deviation), it should be interpreted with caution.</small> </a>
<strong> Cavities </strong>
</div>
</div>
<div class="row text-justify ml-3 mr-3">
<div class="col-8 text-wrap">
Gradient colors for table is based on maximum and minimum zscore in the matrix. Zscore is given when you mouseover a cavity name. Be carefull, if its value is greater
than {{ avg_std|get_zscore_threshold|floatformat:2|intcomma }} (-2 x the standard deviation),
it should be interpreted with caution.
</div>
<div class="col-4">
<table class="gradiant"><tbody><tr>
{% for td in avg_std|make_list %}
{% if forloop.first %}
<td style="background-color:rgb({{ td|get_color:avg_std }})" title="{{ td|get_zscore:avg_std }}">{{ td|get_zscore:avg_std|floatformat:2|intcomma }}</td>
{% elif forloop.last %}
<td style="direction: rtl;background-color:rgb({{ td|get_color:avg_std }})" title="{{ td|get_zscore:avg_std }}">{{ td|get_zscore:avg_std|floatformat:2|intcomma }}</td>
{% else %}
<td style="background-color:rgb({{ td|get_color:avg_std }})" title="{{ td|get_zscore:avg_std }}"> </td>
{% endif %}
{% endfor %}
</tr></tbody></table>
</div>
</div>
</div> </div>
<div class="card-body"> <div class="card-body">
<table id="cavitiestable" class="table table-hover shadow table-responsive table-sm zui-table table-header-rotated"> <table id="cavitiestable" class="table table-hover shadow table-responsive table-sm zui-table table-header-rotated">
......
...@@ -255,3 +255,9 @@ def get_color(distance, avg_std): ...@@ -255,3 +255,9 @@ def get_color(distance, avg_std):
@register.filter @register.filter
def get_zscore_threshold(avg_std): def get_zscore_threshold(avg_std):
return -2 * avg_std.std return -2 * avg_std.std
@register.filter
def make_list(avg_std):
step = (avg_std.maximum - avg_std.minimum) / 25
return np.arange(avg_std.minimum, avg_std.maximum + step, step)
...@@ -43,6 +43,7 @@ INSTALLED_APPS = [ ...@@ -43,6 +43,7 @@ INSTALLED_APPS = [
"django.contrib.messages", "django.contrib.messages",
"django.contrib.staticfiles", "django.contrib.staticfiles",
"django.contrib.sitemaps", "django.contrib.sitemaps",
"django.contrib.humanize",
"django_extensions", "django_extensions",
"django_celery_results", "django_celery_results",
"crispy_forms", "crispy_forms",
......
...@@ -46,6 +46,7 @@ INSTALLED_APPS = [ ...@@ -46,6 +46,7 @@ INSTALLED_APPS = [
"django.contrib.messages", "django.contrib.messages",
"django.contrib.staticfiles", "django.contrib.staticfiles",
"django.contrib.sitemaps", "django.contrib.sitemaps",
"django.contrib.humanize",
"django_extensions", "django_extensions",
"django_celery_results", "django_celery_results",
"crispy_forms", "crispy_forms",
......
Supports Markdown
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