nav 1e test
This commit is contained in:
Monique
@@ -1,6 +1,7 @@
|
||||
<!-- ko if: onderdelen() && onderdelen().length > 0 -->
|
||||
<div class="col-xs-8" >
|
||||
<h3 style="margin-top: 20px;">Kies onderdelen voor het Compact SOP</h3>
|
||||
<h3 style="margin-top: 20px;"
|
||||
data-bind= "text: label() ? 'Kies onderdelen voor het Compact ' + label() : '' "> </h3>
|
||||
</div>
|
||||
<div class="col-xs-4" >
|
||||
<h3 style="margin-top: 20px;" >Gekozen onderdelen </h3>
|
||||
|
||||
@@ -12,24 +12,23 @@
|
||||
<div class="col-xs-12 sopTitel" style="width: 350px;">
|
||||
<p class=" subTitel1" ><?php echo $data[0]->aantallen->naam?></p>
|
||||
|
||||
<span class="subTitel2">Totaal aantal leerlingen: <?php echo $data[0]->aantallen->aantal ?></span>
|
||||
<span class="subTitel2"><?php echo $data[0]->aantallen->totaal ?></span>
|
||||
</div>
|
||||
<?php else : ?>
|
||||
<div class="col-xs-6 sopTitel" style="width: 175px;">
|
||||
<p class=" subTitel1" ><?php echo $data[0]->aantallen->naam?></p>
|
||||
|
||||
<span class="subTitel2">Totaal aantal leerlingen: <?php echo $data[0]->aantallen->aantal ?></span>
|
||||
<span class="subTitel2"><?php echo $data[0]->aantallen->totaal ?></span>
|
||||
</div>
|
||||
<div class="col-xs-6 sopTitel" style="width: 175px; display: inline-block; ">
|
||||
<p class="subTitel1"><?php echo $data[1]->aantallen->naam?></p>
|
||||
<span class="subTitel2">Totaal aantal leerlingen: <?php echo $data[1]->aantallen->aantal;
|
||||
<span class="subTitel2"><?php echo $data[1]->aantallen->totaal;
|
||||
?></span>
|
||||
</div>
|
||||
<?php endif ?>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="sopKaderGrafiek" style="margin-top: 0; padding-top: 0;">
|
||||
<div class="col-xs-12" style="border: 1px #ff0000; margin: 0; padding: 0">
|
||||
<div id="omvangchart" style="width: 350px; height: 175px;">
|
||||
@@ -70,132 +69,11 @@
|
||||
<?php endif ?>
|
||||
</div>
|
||||
<?php endif ?>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
// Build the chart
|
||||
|
||||
$(function(){
|
||||
|
||||
var schooljaren = [];
|
||||
var aantallln = [];
|
||||
var aantalarr = [];
|
||||
var so = 0;
|
||||
var sbo = 0;
|
||||
var so2 = 0;
|
||||
var sbo2 = 0;
|
||||
var aantalso = [];
|
||||
var aantalsbo = [];
|
||||
var series = [];
|
||||
<?php if(isset($data[0])) : ?>
|
||||
schooljaren.push('<?=$data[0]->aantallen->naam ?>');
|
||||
aantallln.push(<?=intval($data[0]->aantallen->aantal) ?>)
|
||||
<?php if($data[0]->arrangementen) : ?>
|
||||
aantalarr.push(<?=intval($data[0]->arrangementen->aantal) ?>)
|
||||
<?php elseif (isset($data[1])) :?>
|
||||
aantalarr.push(0)
|
||||
<?php endif; ?>
|
||||
<?php if($data[0]->tlvs) : ?>
|
||||
<?php foreach($data[0]->tlvs as $tlv) : ?>
|
||||
<?php if($tlv->soort == "SBO") :?>
|
||||
sbo = sbo + (<?= intval($tlv->aantal) ?>)
|
||||
<?php endif; ?>
|
||||
<?php if($tlv->soort == "SO") :?>
|
||||
so = so + (<?= intval($tlv->aantal) ?>)
|
||||
<?php endif; ?>
|
||||
<?php endforeach; ?>
|
||||
aantalsbo.push(sbo)
|
||||
aantalso.push(so)
|
||||
<?php elseif (isset($data[1])) :?>
|
||||
aantalsbo.push(0)
|
||||
aantalso.push(0)
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if(isset($data[1])) : ?>
|
||||
schooljaren.push('<?=$data[1]->aantallen->naam ?>');
|
||||
aantallln.push(<?=intval($data[1]->aantallen->aantal) ?>)
|
||||
<?php if($data[1]->arrangementen) : ?>
|
||||
aantalarr.push(<?=intval($data[1]->arrangementen->aantal) ?>)
|
||||
<?php else :?>
|
||||
aantalarr.push(0)
|
||||
<?php endif; ?>
|
||||
<?php if($data[1]->tlvs) : ?>
|
||||
<?php foreach($data[1]->tlvs as $tlv) : ?>
|
||||
<?php if($tlv->soort == "SBO") :?>
|
||||
sbo2 = sbo2 + (<?= intval($tlv->aantal) ?>)
|
||||
<?php endif; ?>
|
||||
<?php if($tlv->soort == "SO") :?>
|
||||
so2 = so2 + (<?= intval($tlv->aantal) ?>)
|
||||
<?php endif; ?>
|
||||
<?php endforeach; ?>
|
||||
aantalsbo.push(sbo2)
|
||||
aantalso.push(so2)
|
||||
<?php else :?>
|
||||
aantalsbo.push(0)
|
||||
aantalso.push(0)
|
||||
<?php endif; ?>
|
||||
<?php else : ?>
|
||||
schooljaren.unshift(' ');
|
||||
schooljaren.push(' ');
|
||||
aantallln.unshift(<?=intval($data[0]->aantallen->aantal) ?>);
|
||||
aantallln.push(<?=intval($data[0]->aantallen->aantal) ?>);
|
||||
aantalarr.unshift(0);
|
||||
aantalarr.push(0);
|
||||
aantalsbo.unshift(0);
|
||||
aantalsbo.push(0);
|
||||
aantalsbo.unshift(0);
|
||||
<?php endif; ?>
|
||||
|
||||
series.push({
|
||||
type: 'column',
|
||||
name: 'tlvs sbo ',
|
||||
color: '#005c99',
|
||||
data: aantalsbo,
|
||||
stack: 'tlvs'
|
||||
})
|
||||
|
||||
|
||||
series.push({
|
||||
type: 'column',
|
||||
name: 'tlvs so ',
|
||||
color: '#4d9900',
|
||||
data: aantalso,
|
||||
stack: 'tlvs'
|
||||
})
|
||||
|
||||
series.push({
|
||||
type: 'column',
|
||||
name: 'arrangementen',
|
||||
color: '#ffcc80',
|
||||
data: aantalarr,
|
||||
stack: 'arrangementen'
|
||||
})
|
||||
|
||||
|
||||
series.push({
|
||||
type: 'spline',
|
||||
name: 'totaal leerlingen',
|
||||
color : '#A28A29',
|
||||
data: aantallln,
|
||||
marker: {
|
||||
lineWidth: 2
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
maakChart(schooljaren, series)
|
||||
<?php endif; ?>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<?php if(($data[0]->tlvs)) : ?>
|
||||
<?php if(($data[0]->tlvs)) : ?>
|
||||
var pieID = 'tlvs';
|
||||
|
||||
var aantallen = [
|
||||
@@ -284,84 +162,133 @@
|
||||
maakPie(pieID, aantallen2);
|
||||
<?php endif ?>
|
||||
|
||||
var schooljaren = [];
|
||||
var aantallln = [];
|
||||
var arrangementen = [];
|
||||
var so = 0;
|
||||
var sbo = 0;
|
||||
var so2 = 0;
|
||||
var sbo2 = 0;
|
||||
var aantalso = [];
|
||||
var aantalsbo = [];
|
||||
var series = [];
|
||||
<?php if(isset($data[0])) : ?>
|
||||
schooljaren.push('<?=$data[0]->aantallen->naam ?>');
|
||||
aantallln.push(<?=intval($data[0]->aantallen->aantal) ?>)
|
||||
<?php if($data[0]->arrangementen) : ?>
|
||||
arrangementen.push(<?=intval($data[0]->arrangementen->aantal) ?>)
|
||||
<?php elseif (isset($data[1])) :?>
|
||||
arrangementen.push(0)
|
||||
<?php endif; ?>
|
||||
<?php if($data[0]->tlvs) : ?>
|
||||
<?php foreach($data[0]->tlvs as $tlv) : ?>
|
||||
<?php if($tlv->soort == "SBO") :?>
|
||||
sbo = sbo + (<?= intval($tlv->aantal) ?>)
|
||||
<?php endif; ?>
|
||||
<?php if($tlv->soort == "SO") :?>
|
||||
so = so + (<?= intval($tlv->aantal) ?>)
|
||||
<?php endif; ?>
|
||||
<?php endforeach; ?>
|
||||
aantalsbo.push(sbo)
|
||||
aantalso.push(so)
|
||||
<?php elseif (isset($data[1])) :?>
|
||||
aantalsbo.push(0)
|
||||
aantalso.push(0)
|
||||
|
||||
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if(isset($data[1])) : ?>
|
||||
schooljaren.push('<?=$data[1]->aantallen->naam ?>');
|
||||
aantallln.push(<?=intval($data[1]->aantallen->aantal) ?>)
|
||||
<?php if($data[1]->arrangementen) : ?>
|
||||
arrangementen.push(<?=intval($data[1]->arrangementen->aantal) ?>)
|
||||
<?php else :?>
|
||||
arrangementen.push(0)
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if($data[1]->tlvs) : ?>
|
||||
<?php foreach($data[1]->tlvs as $tlv) : ?>
|
||||
<?php if($tlv->soort == "SBO") :?>
|
||||
sbo2 = sbo2 + (<?= intval($tlv->aantal) ?>)
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if($tlv->soort == "SO") :?>
|
||||
so2 = so2 + (<?= intval($tlv->aantal) ?>)
|
||||
<?php endif; ?>
|
||||
<?php endforeach; ?>
|
||||
aantalsbo.push(sbo2)
|
||||
aantalso.push(so2)
|
||||
<?php else :?>
|
||||
aantalsbo.push(0)
|
||||
aantalso.push(0)
|
||||
<?php endif; ?>
|
||||
<?php else : ?>
|
||||
schooljaren.unshift(' ');
|
||||
schooljaren.push(' ');
|
||||
aantallln.unshift(<?=intval($data[0]->aantallen->aantal) ?>);
|
||||
aantallln.push(<?=intval($data[0]->aantallen->aantal) ?>);
|
||||
arrangementen.unshift(0);
|
||||
arrangementen.push(0);
|
||||
aantalsbo.unshift(0);
|
||||
aantalsbo.push(0);
|
||||
aantalsbo.unshift(0);
|
||||
|
||||
|
||||
|
||||
|
||||
<?php endif; ?>
|
||||
|
||||
series.push({
|
||||
type: 'column',
|
||||
name: 'tlvs sbo ',
|
||||
color: '#005c99',
|
||||
data: aantalsbo,
|
||||
stack: 'tlvs'
|
||||
})
|
||||
|
||||
|
||||
series.push({
|
||||
type: 'column',
|
||||
name: 'tlvs so ',
|
||||
color: '#4d9900',
|
||||
data: aantalso,
|
||||
stack: 'tlvs'
|
||||
})
|
||||
|
||||
series.push({
|
||||
type: 'column',
|
||||
name: 'arrangementen',
|
||||
color: '#ffcc80',
|
||||
data: arrangementen,
|
||||
stack: 'arrangementen'
|
||||
})
|
||||
|
||||
|
||||
// series.push({
|
||||
// type: 'spline',
|
||||
// name: 'totaal leerlingen',
|
||||
// color : '#A28A29',
|
||||
// data: aantallln,
|
||||
// marker: {
|
||||
// lineWidth: 2
|
||||
// }
|
||||
// });
|
||||
|
||||
|
||||
maakChart(schooljaren, series)
|
||||
<?php endif; ?>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
});
|
||||
|
||||
function maakChart(schooljaren, series){
|
||||
Highcharts.chart('omvangchart', {
|
||||
// // chart: {
|
||||
// backgroundColor: 'transparent',
|
||||
// plotBorderWidth: null,
|
||||
// plotShadow: false,
|
||||
// margin: [0,-10, 0, -80]
|
||||
// },
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
title: {
|
||||
text: null
|
||||
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
categories: schooljaren
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
allowDecimals: false,
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Aantal leerlingen',
|
||||
style:{
|
||||
fontSize: '8px'
|
||||
},
|
||||
},
|
||||
labels:{
|
||||
style: {
|
||||
fontSize: '8px'
|
||||
} ,
|
||||
},
|
||||
|
||||
stackLabels: {
|
||||
enabled: true,
|
||||
style:{
|
||||
fontSize: '8px',
|
||||
fontWeight: '200'
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
plotOptions: {
|
||||
column: {
|
||||
stacking: 'normal'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
itemStyle: {
|
||||
fontWeight: '200',
|
||||
fontSize: '8px',
|
||||
},
|
||||
// backgroundColor: 'white',
|
||||
borderWidth: 0.5,
|
||||
align: 'right',
|
||||
symbolPadding: 1,
|
||||
padding: 8,
|
||||
verticalAlign: 'top',
|
||||
floating: true,
|
||||
x: 10,
|
||||
y: -2,
|
||||
width: 100,
|
||||
itemWidth: 100,
|
||||
itemDistance: 0,
|
||||
|
||||
},
|
||||
|
||||
series: series
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function maakPie(pieID, punten) {
|
||||
Highcharts.chart(pieID, {
|
||||
chart: {
|
||||
@@ -369,7 +296,7 @@
|
||||
plotBorderWidth: null,
|
||||
plotShadow: false,
|
||||
type: 'pie',
|
||||
margin: [0,-10, -50, -80]
|
||||
margin: [0,-10, 0, -80]
|
||||
},
|
||||
title: {
|
||||
text: null,
|
||||
@@ -417,5 +344,77 @@
|
||||
});
|
||||
}
|
||||
|
||||
function maakChart(schooljaren, series){
|
||||
Highcharts.chart('omvangchart', {
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
title: {
|
||||
text: null
|
||||
|
||||
},
|
||||
|
||||
xAxis: {
|
||||
categories: schooljaren
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
allowDecimals: false,
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Aantal leerlingen',
|
||||
style:{
|
||||
fontSize: '8px'
|
||||
},
|
||||
},
|
||||
labels:{
|
||||
style: {
|
||||
fontSize: '8px'
|
||||
} ,
|
||||
},
|
||||
|
||||
stackLabels: {
|
||||
enabled: true,
|
||||
style:{
|
||||
fontSize: '8px',
|
||||
fontWeight: '200'
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
plotOptions: {
|
||||
column: {
|
||||
stacking: 'normal'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
itemStyle: {
|
||||
fontWeight: '200',
|
||||
fontSize: '8px',
|
||||
},
|
||||
borderWidth: 0.5,
|
||||
align: 'right',
|
||||
symbolPadding: 1,
|
||||
padding: 8,
|
||||
verticalAlign: 'top',
|
||||
floating: true,
|
||||
x: 10,
|
||||
y: -2,
|
||||
width: 100,
|
||||
itemWidth: 100,
|
||||
itemDistance: 0,
|
||||
|
||||
},
|
||||
|
||||
series: series
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -708,9 +708,9 @@
|
||||
|
||||
|
||||
|
||||
<div style="display:none">
|
||||
<div>
|
||||
<div class="container" id='compactSopPdf' >
|
||||
<div style="display:none">
|
||||
<div>
|
||||
<div class="container" id='compactSopPdf' >
|
||||
|
||||
<?php if ($schoolgegevens) { ?>
|
||||
<img style="max-width:45px; height:0px; visibility:hidden"
|
||||
@@ -722,7 +722,7 @@
|
||||
<img style="max-width:50%; height: 0px; visibility:hidden"
|
||||
src="http://app.monpas.nl/images/logos/frameworklogo.png"/>
|
||||
##PLACEHOLDER##
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user