<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:HtmlUtils="de.superx.util.HtmlUtils">
<xsl:import href="xsl_functions.xsl" />
<xsl:import href="resultset_html.xsl" />
<xsl:import href="interLinks_html.xsl" />
<xsl:import href="pageComponents_html.xsl" />
<xsl:import href="menue_html_dojo.xsl" />
<xsl:import href="tabelle_html.xsl" />
<xsl:import href="viz_components.xsl" />
<!--In diesem Stylesheet können Sie individuelle templates unterbringen,
die in ihrer Präzedenz das normale Stylesheet
pageComponents_html.xsl überragt. -->
<xsl:import href="pageComponents_html_final.xsl" />
<xsl:decimal-format name="German" grouping-separator="." NaN="" zero-digit ="0" decimal-separator="," />
<!-- wichtig für DOJO!-->
<xsl:output method="xml" media-type="text/html" doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN"
doctype-system="DTD/xhtml1-strict.dtd" cdata-section-elements="script style" indent="yes" encoding="UTF-8"/>
<xsl:template match="/">
<xsl:call-template name="table"/>
</xsl:template>
<xsl:template name="importVizJavascriptLibs">
<script language="Javascript" type="text/javascript" src="../xml/js/viz/d3.v3.min.js" />
<!--<script language="Javascript" type="text/javascript" src="../xml/js/viz/viz_functions.js" />
<script language="Javascript" type="text/javascript" src="../xml/js/viz/sankey_v3.js" />-->
</xsl:template>
<!-- start table main-->
<xsl:template name="table">
<html>
<xsl:choose>
<xsl:when test="/ergebnisse/@hisinone_active='true'">
<xsl:call-template name="head_hisinone" ><xsl:with-param name="title" select="concat('Ergebnis ',/ergebnisse/ergebnis[ position()=1]/maskenname)" />
<xsl:with-param name="css" select="'../style/bulma.css'" /></xsl:call-template>
</xsl:when>
<xsl:otherwise>
<xsl:call-template name="head_superx" >
<xsl:with-param name="title" select="concat('Ergebnis ',/ergebnisse/ergebnis[ position()=1]/maskenname)" />
<xsl:with-param name="css" select="'../style/bulma.css'" /></xsl:call-template>
</xsl:otherwise>
</xsl:choose>
<xsl:call-template name="tableCSS"></xsl:call-template>
<xsl:call-template name="pccustomize"><xsl:with-param name="position" select="'table_pre_javascript'"></xsl:with-param></xsl:call-template>
<xsl:call-template name="tablecustomize"><xsl:with-param name="position" select="'table_pre_javascript'"></xsl:with-param></xsl:call-template>
<xsl:call-template name="tableJavascript"></xsl:call-template>
<xsl:call-template name="pccustomize"><xsl:with-param name="position" select="'table_post_javascript'"></xsl:with-param></xsl:call-template>
<xsl:call-template name="tablecustomize"><xsl:with-param name="position" select="'table_post_javascript'"></xsl:with-param></xsl:call-template>
<script language="Javascript" type="text/javascript" src="../xml/js/viz/d3.min.js"></script>
<xsl:call-template name="buildVizMetadata">
</xsl:call-template>
<script language="javascript"><![CDATA[
var sorted = d3.sort(rs[0], d => d.man_kennz_aggr_ch110_institut,d => d.man_kennz_aggr_abschluss_grp_str, d => d.man_kennz_aggr_studiengang_str, d => d.man_kennz_aggr_value);
//var group = d3.group(sorted, d => d.sos_stg_aggr_sem_rueck_beur_ein_str);
//console.log(group);
var group = d3.group(sorted, d => d.man_kennz_aggr_ch110_institut,d => d.man_kennz_aggr_abschluss_grp_str, d => d.man_kennz_aggr_studiengang_str , d => d.man_kennz_aggr_value );
var hierarchy = d3.hierarchy(group);
var level1count=hierarchy.children.length;
console.log("level1count:"+level1count);
var data_str = "{\"name\":\"root\",\"children\":[";
for(var i=0; i < level1count ; i++){
console.log("Zeile "+i+ ":" + hierarchy.children[i].data[0]);
data_str+="{\"name\":\""+hierarchy.children[i].data[0]+"\",\"children\":[";
var level2count=hierarchy.children[i].children.length;
for(var j=0; j < level2count ; j++){
console.log("unterZeile "+j+ ":" + hierarchy.children[i].children[j].data[0]);
data_str+="{\"name\":\""+hierarchy.children[i].children[j].data[0]+"\",\"children\":[";
var level3count=hierarchy.children[i].children[j].children.length;
console.log("level3count: "+level3count);
for(var k=0; k < level3count ; k++){
console.log("unterUnterZeile "+k+ ":" + hierarchy.children[i].children[j].children[k].data[0]);
data_str+="{\"name\":\""+hierarchy.children[i].children[j].children[k].data[0]+"\",\"value\":"+hierarchy.children[i].children[j].children[k].children[0].data[0] +"}";
if(k < level3count -1)
data_str+=",";
}
data_str+="]}";
if(j < level2count -1)
data_str+=",";
}
data_str+="]}";
if(i < level1count -1)
data_str+=",";
//console.log("Zeile "+i+ ":" + hierarchy.children[i].children[0].data);
}
data_str+="]}"
console.log(data_str);
var data2=JSON.parse(data_str);
function chart(data) {
// Specify the chart’s dimensions.
const width = 800;
const height = width;
const radius = width / 6;
// Create the color scale.
const color = d3.scaleOrdinal(d3.quantize(d3.interpolateRainbow, data.children.length + 1));
// Compute the layout.
const hierarchy = d3.hierarchy(data)
.sum(d => d.value)
.sort((a, b) => b.value - a.value);
const root = d3.partition()
.size([2 * Math.PI, hierarchy.height + 1])
(hierarchy);
root.each(d => d.current = d);
// Create the arc generator.
const arc = d3.arc()
.startAngle(d => d.x0)
.endAngle(d => d.x1)
.padAngle(d => Math.min((d.x1 - d.x0) / 2, 0.005))
.padRadius(radius * 1.5)
.innerRadius(d => d.y0 * radius)
.outerRadius(d => Math.max(d.y0 * radius, d.y1 * radius - 1))
// Create the SVG container.
const svg = d3.create("svg")
.attr("viewBox", [-width / 2, -height / 2, width, width])
.attr("width",width)
.attr("height",height)
.style("font", "10px sans-serif");
// Append the arcs.
const path = svg.append("g")
.selectAll("path")
.data(root.descendants().slice(1))
.join("path")
.attr("fill", d => { while (d.depth > 1) d = d.parent; return color(d.data.name); })
.attr("fill-opacity", d => arcVisible(d.current) ? (d.children ? 0.6 : 0.4) : 0)
.attr("pointer-events", d => arcVisible(d.current) ? "auto" : "none")
.attr("d", d => arc(d.current));
// Make them clickable if they have children.
path.filter(d => d.children)
.style("cursor", "pointer")
.on("click", clicked);
const format = d3.format(",d");
path.append("title")
.text(d => `${d.ancestors().map(d => d.data.name).reverse().join("/")}\n${format(d.value)}`);
const label = svg.append("g")
.attr("pointer-events", "none")
.attr("text-anchor", "middle")
.style("user-select", "none")
.selectAll("text")
.data(root.descendants().slice(1))
.join("text")
.attr("dy", "0.35em")
.attr("fill-opacity", d => +labelVisible(d.current))
.attr("transform", d => labelTransform(d.current))
.text(d => d.data.name);
const parent = svg.append("circle")
.datum(root)
.attr("r", radius)
.attr("fill", "none")
.attr("pointer-events", "all")
.on("click", clicked);
// Handle zoom on click.
function clicked(event, p) {
parent.datum(p.parent || root);
root.each(d => d.target = {
x0: Math.max(0, Math.min(1, (d.x0 - p.x0) / (p.x1 - p.x0))) * 2 * Math.PI,
x1: Math.max(0, Math.min(1, (d.x1 - p.x0) / (p.x1 - p.x0))) * 2 * Math.PI,
y0: Math.max(0, d.y0 - p.depth),
y1: Math.max(0, d.y1 - p.depth)
});
const t = svg.transition().duration(750);
// Transition the data on all arcs, even the ones that aren’t visible,
// so that if this transition is interrupted, entering arcs will start
// the next transition from the desired position.
path.transition(t)
.tween("data", d => {
const i = d3.interpolate(d.current, d.target);
return t => d.current = i(t);
})
.filter(function(d) {
return +this.getAttribute("fill-opacity") || arcVisible(d.target);
})
.attr("fill-opacity", d => arcVisible(d.target) ? (d.children ? 0.6 : 0.4) : 0)
.attr("pointer-events", d => arcVisible(d.target) ? "auto" : "none")
.attrTween("d", d => () => arc(d.current));
label.filter(function(d) {
return +this.getAttribute("fill-opacity") || labelVisible(d.target);
}).transition(t)
.attr("fill-opacity", d => +labelVisible(d.target))
.attrTween("transform", d => () => labelTransform(d.current));
}
function arcVisible(d) {
return d.y1 <= 3 && d.y0 >= 1 && d.x1 > d.x0;
}
function labelVisible(d) {
return d.y1 <= 3 && d.y0 >= 1 && (d.y1 - d.y0) * (d.x1 - d.x0) > 0.03;
}
function labelTransform(d) {
const x = (d.x0 + d.x1) / 2 * 180 / Math.PI;
const y = (d.y0 + d.y1) / 2 * radius;
return `rotate(${x - 90}) translate(${y},0) rotate(${x < 180 ? 0 : 180})`;
}
return svg.node();
}
function showChart(){
var mySvg=chart(data2);
//alert(mySvg);
document.getElementById("chartDiv").appendChild(mySvg);
}
]]>
</script>
<!-- start Body-->
<body onload="document.getElementById('progressbar').style.display='none';showChart();">
<div id="progressbar" style="position:absolute; width:150px; height:150px; left:200px; top:200px; background:#AAAAAA">
<p> <b>Laden...</b><br/><img src="/superx/images/progress_bar.gif"></img><br/></p></div>
<xsl:if test="/ergebnisse/@showNavigation='true'">
<xsl:for-each select="/ergebnisse/menue">
<xsl:call-template name="menuFrame" />
</xsl:for-each>
</xsl:if>
<div>
<xsl:if test="/ergebnisse/@showNavigation='true'">
<xsl:attribute name="class"><xsl:text>page-wrap</xsl:text></xsl:attribute>
<xsl:for-each select="/ergebnisse/menue">
<xsl:call-template name="topbar_menue" />
</xsl:for-each>
</xsl:if>
<div>
<xsl:if test="/ergebnisse/@showNavigation='true'">
<xsl:attribute name="id"><xsl:text>wrapper</xsl:text></xsl:attribute>
</xsl:if>
<xsl:call-template name="customheader"/> <!--Standard in pageCompnents.xsl wird ggfs. direkt vom Servlet ersetzt!!-->
<xsl:call-template name="topbar_table" /> <!-- momentan nur in pageCompnents_final fuer h1 gefullet -->
<xsl:call-template name="pccustomize"><xsl:with-param name="position" select="'table_pre_center'"></xsl:with-param></xsl:call-template>
<xsl:call-template name="tablecustomize"><xsl:with-param name="position" select="'table_pre_center'"></xsl:with-param></xsl:call-template>
<xsl:for-each select="ergebnisse">
<xsl:for-each select="ergebnis/ergebniselement">
<h2><xsl:value-of select="../felder/feld [@varname='Kennzahl']/value_caption" /></h2>
<xsl:call-template name="legende" />
</xsl:for-each>
</xsl:for-each>
<div class="box" style="align:center;">
<div class="card is-shady">
<div class="card-content">
<div id="chartDiv">
</div>
</div>
</div>
</div>
<!--<input type="button" value="Start" onClick="showChart()" />-->
<!--<xsl:call-template name="tableCenter"/>-->
<xsl:call-template name="pccustomize"><xsl:with-param name="position" select="'table_post_center'"></xsl:with-param></xsl:call-template>
<xsl:call-template name="tablecustomize"><xsl:with-param name="position" select="'table_post_center'"></xsl:with-param></xsl:call-template>
<xsl:call-template name="tableDialogs"></xsl:call-template>
<!--<div class="dontprint" id="dojoDebug"></div>-->
<xsl:call-template name="bottombar" />
<xsl:comment>customfooter</xsl:comment>
</div>
</div>
<xsl:call-template name="footer" />
</body>
<!-- end body -->
</html>
</xsl:template>
<xsl:template name="buildVizData">
<xsl:param name="tableId" />
<script language="Javascript">
<xsl:text>
rsTableMetaData.push(new tableMetaData(
</xsl:text>
<xsl:value-of select="position()"/>
<xsl:text>,'</xsl:text>
<xsl:value-of select="$tableId"/>
<xsl:text>','</xsl:text>
<xsl:value-of select="concat('Tab. ',$tableId+1)"/>
<xsl:text>',
</xsl:text>
<xsl:choose>
<xsl:when test="position()=1">
<xsl:text>true</xsl:text>
</xsl:when>
<xsl:otherwise>
<xsl:text>false</xsl:text>
</xsl:otherwise>
</xsl:choose>
<xsl:text>
));
rs[</xsl:text><xsl:value-of select="$tableId"/><xsl:text>]=new Array();
//var myChartModel=new chartModel(1,"","",rsTableMetaData);
function dataRow_</xsl:text><xsl:value-of select="$tableId"/><xsl:text>(rownr</xsl:text>
<xsl:for-each select="sqlerg/complete_headers/header">
<xsl:text>,</xsl:text>
<xsl:call-template name="getColumnNameJS">
<xsl:with-param name="columnNameFromDB" select="f_name"/>
</xsl:call-template>
</xsl:for-each>
<xsl:text>
)
{
this.rownr=rownr;
</xsl:text>
<xsl:for-each select="sqlerg/complete_headers/header">
<xsl:text>this.</xsl:text><xsl:call-template name="getColumnNameJS">
<xsl:with-param name="columnNameFromDB" select="f_name"/>
</xsl:call-template><xsl:text>=</xsl:text>
<xsl:call-template name="getColumnNameJS">
<xsl:with-param name="columnNameFromDB" select="f_name"/>
</xsl:call-template><xsl:text>;
</xsl:text>
</xsl:for-each><xsl:text>
}
rsColumnMetaData[</xsl:text><xsl:value-of select="$tableId"/><xsl:text>]=new Array();
rsColumnMetaData[</xsl:text><xsl:value-of select="$tableId"/><xsl:text>].push(new dataRowMetaData('</xsl:text>
<xsl:value-of select="$tableId"/><xsl:text>',</xsl:text>
<xsl:value-of select="0"/>
<xsl:text>,'rownr','Zeilennr.',0,4));
</xsl:text>
<xsl:for-each select="sqlerg/complete_headers/header">
<xsl:variable name="rownr">
<xsl:value-of select="position()"/>
</xsl:variable>
<xsl:text>
rsColumnMetaData[</xsl:text><xsl:value-of select="$tableId"/><xsl:text>].push(new dataRowMetaData('</xsl:text>
<xsl:value-of select="$tableId"/><xsl:text>',</xsl:text>
<xsl:value-of select="$rownr"/>
<xsl:text>,'</xsl:text>
<xsl:call-template name="getColumnNameJS">
<xsl:with-param name="columnNameFromDB" select="f_name"/>
</xsl:call-template>
<xsl:text>','</xsl:text>
<xsl:call-template name="remove_linebreaksAndQuot">
<xsl:with-param name="volltext" select="wert" />
</xsl:call-template>
<xsl:text>',0,null));</xsl:text> <!--coltype noch unbekannt, colfunction unnötig-->
</xsl:for-each>
<xsl:for-each select="sqlerg/row">
<xsl:variable name="rownr">
<xsl:value-of select="position()"/>
</xsl:variable>
<xsl:if test="$rownr=1">
<!-- first metadata -->
<xsl:for-each select="col">
<xsl:variable name="colnr">
<xsl:value-of select="position()"/>
</xsl:variable>
<xsl:text>
rsColumnMetaData[</xsl:text><xsl:value-of select="$tableId"/><xsl:text>][</xsl:text><xsl:value-of select="number($colnr)"/><xsl:text>].coltype=</xsl:text><xsl:value-of select="@typ"/>
<xsl:text>;
</xsl:text>
</xsl:for-each>
</xsl:if>
<!--now resultset-->
<xsl:text>
//rs[</xsl:text><xsl:value-of select="$tableId"/><xsl:text>]= new Array();
rs[</xsl:text><xsl:value-of select="$tableId"/><xsl:text>].push(new dataRow_</xsl:text><xsl:value-of select="$tableId"/><xsl:text>(</xsl:text><xsl:value-of select="$rownr"/>
<xsl:for-each select="col">
<xsl:text>,</xsl:text>
<xsl:choose>
<xsl:when test="@typ='1'"><xsl:text>'</xsl:text>
<xsl:call-template name="remove_linebreaksAndQuot">
<xsl:with-param name="volltext" select="wert" />
</xsl:call-template>
<xsl:text>'</xsl:text></xsl:when>
<!--todo:Typ Datum -->
<xsl:when test="string-length(wert)=0"><xsl:text>null</xsl:text>
</xsl:when>
<xsl:otherwise>
<xsl:value-of select="wert"/>
</xsl:otherwise>
</xsl:choose>
</xsl:for-each>
<xsl:text>));
</xsl:text>
</xsl:for-each>
</script>
</xsl:template>
<xsl:template name="head_superx">
<xsl:param name="css" />
<xsl:param name="title" />
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</meta><!-- <link rel="stylesheet" type="text/css" href="/superx/xml/his1/css/superx_menue_html.css" /> -->
<link rel="stylesheet" type="text/css" href="../style/superx.css"/>
<link rel="stylesheet" type="text/css" href="../xml/menue_html.css"/>
<!-- <LINK REL="stylesheet" type="text/css" href="../xml/superxml_html.css" ></LINK> unschoene CSS Trick mit img size 16-->
<link rel="stylesheet" type="text/css" href="../xml/superx_standalone.css"/>
<link rel="stylesheet" type="text/css" href="../xml/maske_html.css" />
<link rel="stylesheet" type="text/css" href="../xml/tabelle_html.css" />
<link rel="stylesheet" type="text/css" href="../xml/css/fontello-codes.css" />
<link rel="stylesheet" type="text/css" href="../xml/css/start_portlet.css" />
<!--<LINK REL="stylesheet" type="text/css" href="../style/superx.css"
></LINK> <LINK REL="stylesheet" type="text/css" href="../xml/superxml_html.css"
></LINK> -->
<xsl:choose>
<xsl:when test="$title != ''">
<xsl:choose>
<xsl:when test="starts-with($title,'Mask') ">
<link rel="stylesheet" type="text/css" href="../xml/maske_html.css" />
</xsl:when>
<xsl:otherwise>
<!-- Styles für HIS1 sind in xml/his1/css/superx_menue_html.css definiert
<LINK REL="stylesheet" type="text/css" href="../xml/tabelle_html.css" ></LINK> -->
</xsl:otherwise>
</xsl:choose>
<title>
<xsl:value-of select="$title" />
</title>
</xsl:when>
<xsl:otherwise>
<title>
<xsl:text>SuperX</xsl:text>
</title>
</xsl:otherwise>
</xsl:choose>
<!-- <script src="../xml/js/jquery/jquery-1.12.4.min.js"></script>-->
<script src="../xml/js/jquery/jquery.mobile-1.4.2.min.js"></script>
<link rel="stylesheet" href="../xml/js/jquery/jquery.mobile.structure-1.4.2.dw.css" />
<link rel="stylesheet" href="../xml/js/jquery/jqm-demos.dw.css" />
<xsl:if test="$css != ''">
<link rel="stylesheet" type="text/css" href="{$css}" />
</xsl:if>
</head>
</xsl:template>
<xsl:template name="head_hisinone">
<xsl:param name="css" />
<xsl:param name="title" />
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</meta>
<link rel="stylesheet" type="text/css"
href="../xml/his1/css/superx_menue_html.css" />
<link rel="stylesheet" type="text/css" href="../xml/maske_html.css" />
<!--<LINK REL="stylesheet" type="text/css" href="../style/superx.css"
></LINK> <LINK REL="stylesheet" type="text/css" href="../xml/superxml_html.css"
></LINK> -->
<xsl:choose>
<xsl:when test="$title != ''">
<xsl:choose>
<xsl:when test="starts-with($title,'Mask') ">
<link rel="stylesheet" type="text/css" href="../xml/maske_html.css" />
</xsl:when>
<xsl:otherwise>
<!-- Styles für HIS1 sind in xml/his1/css/superx_menue_html.css definiert
<LINK REL="stylesheet" type="text/css" href="../xml/tabelle_html.css" ></LINK> -->
</xsl:otherwise>
</xsl:choose>
<title>
<xsl:value-of select="$title" />
</title>
</xsl:when>
<xsl:otherwise>
<title>
<xsl:text>HISinOne-BI</xsl:text>
</title>
</xsl:otherwise>
</xsl:choose>
<link rel="stylesheet" type="text/css" href="../xml/his1/css/HISinOne.css" />
<link rel="stylesheet" href="../xml/js/jquery/jquery.mobile.structure-1.4.2.dw.css" />
<link rel="stylesheet" href="../xml/js/jquery/jqm-demos.dw.css" />
<xsl:if test="$css != ''">
<link rel="stylesheet" type="text/css" href="{$css}" />
</xsl:if>
</head>
</xsl:template>
</xsl:stylesheet>