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{
transform:scale(1) rotate(0);
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){
hasinteract = 1;
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(createElement('br'));
var divdropdowninterac = createElement("div",{},{},"dropdown");
......@@ -491,7 +491,7 @@ function loadNGL(url, callback){
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});
divvalueslider.innerHTML = 'current value: 0.7'
divchainmrc.appendChild(labelslider);
......
{% extends "base.html" %}
{% load humanize %}
{% load customtags %}
{% load static %}
{% block title %}Target Centric view{% endblock %}
......@@ -142,19 +143,41 @@
</div>
</div>
<div class="card">
<div class="card-title text-center">
<a class="infobulle" href='#'>
<i class="fas fa-question-circle fa-2x"></i>
<span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas pulvinar ornare hendrerit.
Phasellus urna neque, vehicula in eleifend ut, aliquam quis nunc. Nam dapibus lobortis nulla id faucibus.
Morbi rhoncus libero at lectus iaculis sagittis. Phasellus egestas enim odio, porta lobortis neque sodales
vitae. Fusce molestie posuere ultricies. Sed interdum ipsum vel metus condimentum, ac vehicula enim molestie.
Nunc pharetra tortor ullamcorper lacinia viverra. Pellentesque in tempor mauris. Integer convallis urna a
ligula ultricies venenatis. Duis ut congue magna. </span>
</a>
<strong>Cavities</strong>
<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>
<div class="card-title">
<div class="row text-center mt-3">
<div class="col-12">
<a class="infobulle" href='#'>
<i class="fas fa-question-circle fa-2x"></i>
<span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas pulvinar ornare hendrerit.
Phasellus urna neque, vehicula in eleifend ut, aliquam quis nunc. Nam dapibus lobortis nulla id faucibus.
Morbi rhoncus libero at lectus iaculis sagittis. Phasellus egestas enim odio, porta lobortis neque sodales
vitae. Fusce molestie posuere ultricies. Sed interdum ipsum vel metus condimentum, ac vehicula enim molestie.
Nunc pharetra tortor ullamcorper lacinia viverra. Pellentesque in tempor mauris. Integer convallis urna a
ligula ultricies venenatis. Duis ut congue magna. </span>
</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 class="card-body">
<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):
@register.filter
def get_zscore_threshold(avg_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 = [
"django.contrib.messages",
"django.contrib.staticfiles",
"django.contrib.sitemaps",
"django.contrib.humanize",
"django_extensions",
"django_celery_results",
"crispy_forms",
......
......@@ -46,6 +46,7 @@ INSTALLED_APPS = [
"django.contrib.messages",
"django.contrib.staticfiles",
"django.contrib.sitemaps",
"django.contrib.humanize",
"django_extensions",
"django_celery_results",
"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