webapps/portal-oddajanje-solar
16
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fixes

Browse Source
This commit is contained in:
Leon Noe Jovan
2023-01-14 13:45:33 +01:00
parent 10e8116d83
commit e6c87bb3f6
13 changed files with 318 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

99
templates/solar-pogodbe.html
View File

@@ -3,6 +3,8 @@
<head>
<meta charset="UTF-8">
<title>Portal za oddajanje besedil</title>
<link rel="icon" href="/static/favicon.ico" type="image/x-icon" >
<link rel="icon" href="static/favicon.svg" sizes="any" type="image/svg+xml">
<link rel="stylesheet" href="{{ROUTE_PREFIX}}/static/css/header.css" type="text/css">
<link rel="stylesheet" href="{{ROUTE_PREFIX}}/static/css/form.css" type="text/css">
<link rel="stylesheet" href="{{ROUTE_PREFIX}}/static/css/simple-grid.css" type="text/css">
@@ -13,12 +15,12 @@
<div class="logo"><a href="{{ROUTE_PREFIX}}/"><img src="{{ROUTE_PREFIX}}/static/image/logo-white.svg"/></a></div>
<div class="menu-items">
{% if is_institution_coordinator %}
<a href="{{ROUTE_PREFIX}}/manage-institution">Upravljaj z institucijo</a>
<a href="{{ROUTE_PREFIX}}/manage-institution">Upravljaj z ekipo</a>
{% endif %}
{% if is_admin %}
<a href="{{ROUTE_PREFIX}}/admin">Administracijski meni</a>
{% endif %}
<a href="https://slovenscina.eu/" target="_blank">Več informacij</a>
<a href="https://slovenscina.eu/" target="_blank">Več informacij o sodelovanju</a>
<a href="{{ROUTE_PREFIX}}/logout">Odjava</a>
</div>
</header>
@@ -79,7 +81,27 @@
{% endfor %}
{% endfor %}
<div class="row" id="my_dataviz__region_title">
<div class="col-12">
<h2>Število vseh oddaj po regijah</h2>
</div>
</div>
<div class="row">
<div class="col-6">
<div id="my_dataviz_region">
</div>
<div>
<div style="display:inline-block;width:12px;height:12px;background:#006CB7"></div>
<p style="display:inline-block">Osnovne šole</p>
<div style="margin-left:32px;display:inline-block;width:12px;height:12px;background:#B86D00"></div>
<p style="display:inline-block">Sredje šole</p>
</div>
</div>
</div>
</div>
@@ -96,6 +118,12 @@
#my_dataviz path.domain{
visibility:hidden;
}
#my_dataviz_region .tick line{
visibility:hidden;
}
#my_dataviz_region path.domain{
visibility:hidden;
}
</style>
<script>
var data;
@@ -158,10 +186,77 @@
.attr("width", function(d) { return x(d.value); })
.attr("height", 32 )
.attr("fill", "#006CB7");
})
</script>
<script>
var data;
// Parse the Data
d3.json("/uploadstats-per-region").then(function(jsondata) {
data = [];
console.log(Object.keys(jsondata).length);
var margin = {top: 20, right: 0, bottom: 40, left: 0};
var width = document.getElementById("my_dataviz_region").clientWidth - margin.left - margin.right;
var height = Object.keys(jsondata).length * 56;
var svg = d3.select("#my_dataviz_region")
.append("svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + margin.top + margin.bottom)
.style("overflow","visible")
.append("g")
.attr("transform",
"translate(" + margin.left + "," + margin.top + ")");
for(var key in jsondata) {
data.push({'name': key, 'value':jsondata[key]});
}
console.log(data);
// Add X axis
var x = d3.scaleLinear()
.domain([0,d3.max(data, function (d) { return Math.max(...d.value)})])
.range([ 0, width]);
svg.append("g")
.attr("transform", "translate(0," + height + ")")
.call(d3.axisBottom(x))
.selectAll("text")
.style("text-anchor", "center");
// Y axis
var y = d3.scaleBand()
.range([ 0, data.length*56 ])
.domain(data.map(function(d) { return d.name; }))
.padding(0);
svg.append("g")
.call(d3.axisLeft(y))
.selectAll("text")
.style("text-anchor", "start")
.style("font-size", "14px")
.attr("transform", "translate(8,-36)");
//Bars
svg.selectAll("myRect")
.data(data)
.enter()
.append("rect")
.attr("x", x(0) )
.attr("y", function(d) { return y(d.name); })
.attr("width", function(d) { return x(d.value[0]); })
.attr("height", 16 )
.attr("fill", "#006CB7");
svg.selectAll("myRect")
.data(data)
.enter()
.append("rect")
.attr("x", x(0) )
.attr("y", function(d) { return y(d.name); })
.attr("width", function(d) { return x(d.value[1]); })
.attr("height", 16 )
.attr("transform", "translate(0,16)")
.attr("fill", "#B86D00");
})
</script>