SuperX
/
viz
6
0
Fork 0
Code Issues 8 Pull Requests Projects Releases Wiki Activity
Browse Source

Layout Assistent Formulare #5

makro_datasrc
Daniel Quathamer 2 years ago
parent
1e319d0b1a
commit
3a2fd9b2f8
2 changed files with 409 additions and 178 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 147
      superx/xml/js/viz/viz_functions.js
  2. 352
      superx/xml/viz_html_chart.xsl

147
superx/xml/js/viz/viz_functions.js
Unescape View File

@ -160,7 +160,8 @@ function prepareChartProperties(chartType) @@ -160,7 +160,8 @@ function prepareChartProperties(chartType)
return false;
break;
}
renderForm("chartPropertiesFormDetails",chartProperties,commonChartProperties);
renderForm("chartPropertiesForm",chartProperties);
renderFormDetails("chartPropertiesFormDetails",commonChartProperties);
return true;
@ -365,27 +366,26 @@ function fillSelectionResult(selectionRsMetaData) @@ -365,27 +366,26 @@ function fillSelectionResult(selectionRsMetaData)
}
function renderForm(formDiv,chartProperties,myCommonChartProperties)
function renderForm(formDiv,myChartProperties)
{
//first empty form:
var myForm=document.getElementById(formDiv);
while (myForm.firstChild) {
myForm.removeChild(myForm.firstChild);
}
/*
const tabElem = document.createElement("table");
//tabElem.caption="Eigenschaften";
myForm.appendChild(tabElem);
for(var k=0;k < chartProperties.length;k++)
for(var k=0;k < myChartProperties.length;k++)
{
const rowElem = document.createElement("tr");
const tdCap = document.createElement("td");
const textnode = document.createTextNode(chartProperties[k].caption);
const textnode = document.createTextNode(myChartProperties[k].caption);
tdCap.appendChild(textnode);
const tdSelElem = document.createElement("td");
const selElem = document.createElement("select");
selElem.name=chartProperties[k].name;
selElem.id=chartProperties[k].name;
fillSelectOptions(selElem,chartProperties[k].getValueResultset(),chartProperties[k].isMandatory);
selElem.name=myChartProperties[k].name;
selElem.id=myChartProperties[k].name;
fillSelectOptions(selElem,myChartProperties[k].getValueResultset(),myChartProperties[k].isMandatory);
tdSelElem.appendChild(selElem);
rowElem.appendChild(tdCap);
@ -393,6 +393,58 @@ function renderForm(formDiv,chartProperties,myCommonChartProperties) @@ -393,6 +393,58 @@ function renderForm(formDiv,chartProperties,myCommonChartProperties)
//here values, and then:
tabElem.appendChild( rowElem);
}
myForm.appendChild(tabElem);
*/
for(var k=0;k < myChartProperties.length;k++)
{
const fieldElem = document.createElement("div");
fieldElem.classList.add("field");
fieldElem.classList.add("is-grouped");
//label:
const labelElem = document.createElement("div");
labelElem.classList.add("label-container");
const label = document.createElement("label");
label.classList.add("label");
label.classList.add("is-required");
label.classList.add("is-small");
const textnode = document.createTextNode(myChartProperties[k].caption);
label.appendChild(textnode);
labelElem.appendChild(label);
fieldElem.appendChild(labelElem);
//input:
const inputFieldElem = document.createElement("div");
inputFieldElem.classList.add("field");
inputFieldElem.classList.add("is-active");
const inputParaElem = document.createElement("p");
inputParaElem.classList.add("control-new");
const inputSelectElem = document.createElement("div");
inputSelectElem.classList.add("select");
inputSelectElem.classList.add("is-small");
inputSelectElem.classList.add("is-fullwidth");
const selElem = document.createElement("select");
selElem.name=myChartProperties[k].name;
selElem.id=myChartProperties[k].name;
fillSelectOptions(selElem,myChartProperties[k].getValueResultset(),myChartProperties[k].isMandatory);
inputSelectElem.appendChild(selElem);
inputParaElem.appendChild(inputSelectElem);
inputFieldElem.appendChild(inputParaElem);
fieldElem.appendChild(inputFieldElem);
myForm.appendChild(fieldElem);
}
}
function renderFormDetails(formDiv,myCommonChartProperties)
{
//first empty form:
var myForm=document.getElementById(formDiv);
while (myForm.firstChild) {
myForm.removeChild(myForm.firstChild);
}
const tabElem = document.createElement("table");
//tabElem.caption="Eigenschaften";
for(var k=0;k < myCommonChartProperties.length;k++)
{
const rowElem = document.createElement("tr");
@ -426,14 +478,10 @@ function renderForm(formDiv,chartProperties,myCommonChartProperties) @@ -426,14 +478,10 @@ function renderForm(formDiv,chartProperties,myCommonChartProperties)
//here values, and then:
tabElem.appendChild( rowElem);
}
myForm.appendChild(tabElem);
//TODO: myCommonChartProperties auf separatem TAB
}
function fillSelectOptions(myCombo,myValues,isMandatory)
{
var optionCounter=0;
@ -595,17 +643,15 @@ for(row=1;row<rowcount;row++) @@ -595,17 +643,15 @@ for(row=1;row<rowcount;row++)
tableDiv.appendChild(tabElem);
}
function createChart()
function createChart(chartDivElem)
{
chartType=document.getElementById("viz_chart_type").value;
/*
if(document.getElementById("dimension1").value=="" ||
document.getElementById("measure1").value=="" )
{
alert("Bitte wählen Sie eine Kategorie und ein Maß");
return false;
}
*/
var myDiv=document.getElementById(chartDivElem);
if(myDiv.style.display=="block")
myDiv.style.display="none";
else
myDiv.style.display="block";
var selectionRsMetaData=[];
var selectionRs=[];
@ -622,8 +668,8 @@ var gridChartOffset = getCommonChartProperty("gridChartOffset"); @@ -622,8 +668,8 @@ var gridChartOffset = getCommonChartProperty("gridChartOffset");
var chartWidth=getCommonChartProperty("chartWidth");
var fontSize=getCommonChartProperty("fontSize");
//svg,data
document.getElementById("chartDiv").innerHTML=""; //reset canvas
var svg = d3.select("#chartDiv").append("svg")
document.getElementById(chartDivElem).innerHTML=""; //reset canvas
var svg = d3.select("#"+chartDivElem).append("svg")
.attr("width", chartWidth) //maxBarWidth + barLabelWidth + valueLabelWidth)
//.attr("height", y.range()[1])
.attr("font-family", fontFamily)
@ -638,19 +684,19 @@ case "sample": @@ -638,19 +684,19 @@ case "sample":
makeSample();
break;
case "bar_x":
makeBarX(selectionRs);
makeBarX(chartDivElem,selectionRs);
break;
case "bar_x_alt":
makeBarX(svg,data);
break;
case "bar_y":
makeBarY(selectionRs);
makeBarY(chartDivElem,selectionRs);
break;
case "area_y":
makeAreaY(selectionRs);
makeAreaY(chartDivElem,selectionRs);
break;
case "line":
makeLine(selectionRs);
makeLine(chartDivElem,selectionRs);
break;
default:
alert("Please select a chart type");
@ -775,6 +821,7 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti @@ -775,6 +821,7 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
var myFontFamily=getCommonChartProperty("font-family");
var myBgColor=getCommonChartProperty("background-color");
var myColor=getCommonChartProperty("color");
var myCaption=getCommonChartProperty("chartCaption");
var marginLeftDefault=chartWidth/5; //20% liner Rand
var marginBottomDefault=100;
@ -804,7 +851,8 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti @@ -804,7 +851,8 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
label: measureLabel
},
marks: marksArray,
style: styles
style: styles,
caption: myCaption
}
}
else
@ -822,7 +870,8 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti @@ -822,7 +870,8 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
label: measureLabel
},
marks: marksArray,
style: styles
style: styles,
caption:myCaption
}
@ -831,21 +880,31 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti @@ -831,21 +880,31 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
return options;
}
function makeBarX(selectionRs) {
function makeBarX(chartDivElem,selectionRs) {
var categoryDim=document.getElementById("viz_dimension1").value;
var measureDim=document.getElementById("viz_measure1").value;
var fillDim=document.getElementById("fill").value;
var marksArray=new Array();
if(fillDim=="")
marksArray[0]=Plot.barX(selectionRs,
{
x: measureDim,
y: categoryDim
y: categoryDim,
fill: "blue"
});
else
marksArray[0]=Plot.barX(selectionRs,
{
x: measureDim,
y: categoryDim,
fill: fillDim
});
var options= getChartOptions(categoryDim,measureDim,marksArray,false);
document.getElementById("chartDiv").appendChild(Plot.plot(options));
document.getElementById(chartDivElem).appendChild(Plot.plot(options));
}
function makeBarY(selectionRs) {
function makeBarY(chartDivElem,selectionRs) {
var categoryDim=document.getElementById("viz_dimension1").value;
var measureDim=document.getElementById("viz_measure1").value;
var marksArray=new Array();
@ -857,9 +916,9 @@ function makeBarY(selectionRs) { @@ -857,9 +916,9 @@ function makeBarY(selectionRs) {
var options= getChartOptions(categoryDim,measureDim,marksArray,true);
document.getElementById("chartDiv").appendChild(Plot.plot(options));
document.getElementById(chartDivElem).appendChild(Plot.plot(options));
}
function makeAreaY(selectionRs) {
function makeAreaY(chartDivElem,selectionRs) {
var categoryDim=document.getElementById("viz_dimension1").value;
var measureDim=document.getElementById("viz_measure1").value;
var marksArray=new Array();
@ -871,9 +930,9 @@ function makeAreaY(selectionRs) { @@ -871,9 +930,9 @@ function makeAreaY(selectionRs) {
var options= getChartOptions(categoryDim,measureDim,marksArray,true);
document.getElementById("chartDiv").appendChild(Plot.plot(options));
document.getElementById(chartDivElem).appendChild(Plot.plot(options));
}
function makeLine(selectionRs) {
function makeLine(chartDivElem,selectionRs) {
var categoryDim=document.getElementById("viz_dimension1").value;
var measureDim=document.getElementById("viz_measure1").value;
var marksArray=new Array();
@ -891,7 +950,7 @@ function makeLine(selectionRs) { @@ -891,7 +950,7 @@ function makeLine(selectionRs) {
var options= getChartOptions(categoryDim,measureDim,marksArray,true);
document.getElementById("chartDiv").appendChild(Plot.plot(options));
document.getElementById(chartDivElem).appendChild(Plot.plot(options));
}
function makeBarY_alt(svg,data) {
var xLabel=rsMetaData[document.getElementById("dimension1").value-1].colcaption;
@ -951,7 +1010,13 @@ function getCommonChartProperty(name) @@ -951,7 +1010,13 @@ function getCommonChartProperty(name)
function showSrcCode()
{
var myChartDiv= document.getElementById("chartDiv");
var myChartDiv= document.getElementById("chartDiv2");
var mySrcDiv=document.getElementById("chartSVGsrc");
if(mySrcDiv.style.display=="block")
mySrcDiv.style.display="none";
else
mySrcDiv.style.display="block";
var numberOfChildNodes=myChartDiv.childNodes.length;
var svg_xml ="";
for (var i=0;i<numberOfChildNodes;i++)
@ -966,7 +1031,7 @@ for (var i=0;i<numberOfChildNodes;i++) @@ -966,7 +1031,7 @@ for (var i=0;i<numberOfChildNodes;i++)
}
//alert(svg_xml);
document.getElementById("chartSrc").innerHTML=svg_xml;
document.getElementById("chartSVGsrc").style.visibility="visible";
//document.getElementById("chartSVGsrc").style.visibility="visible";
/*
const selection = window.getSelection();
const range = document.createRange();

352
superx/xml/viz_html_chart.xsl
Unescape View File

@ -164,6 +164,9 @@ commonChartProperties.push(newCommonChartProperty); @@ -164,6 +164,9 @@ commonChartProperties.push(newCommonChartProperty);
var newCommonChartProperty = new commonChartProperty("background-color","Hintergrundfarbe", false,0, null,"#ffffeb");
commonChartProperties.push(newCommonChartProperty);
var newCommonChartProperty = new commonChartProperty("fill","Füllfarbe", false,0, null,"blue");
commonChartProperties.push(newCommonChartProperty);
var newCommonChartProperty = new commonChartProperty("color","Farbe Text- und Diagrammelemente", false,0, null,"#3333ff");
commonChartProperties.push(newCommonChartProperty);
@ -1296,46 +1299,55 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1296,46 +1299,55 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
</script>
</xsl:template>
<xsl:template name="diagrammdaten">
<div class="field is-grouped">
<!--Aufruf/Anzeige Diagrammdaten-->
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Datentabelle</strong></label>
<label class="label is-required is-small"><strong>Daten-Tabelle</strong></label>
</div>
<span class="separator"> </span>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<button class="button is-small is-rounded is-white is-outlined"
onClick="showDataTable('dataDivTable',rs,rsMetaData,10);"><!--is-focused-->
onClick="showDataTable('dataDivTable',rs,rsMetaData,10);">
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</button>
</div>
<div id="dataDiv" class="section">
<div id="dataDivTable"> <!--style="border:thin solid black">-->
</div>
<div id="dataDiv"> <!--class="section">-->
<div id="dataDivTable"> <!--style="border:thin solid black">-->
</div>
</div>
<div class="field is-grouped">
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<!--Aufruf/Anzeige Formular Datenauswahl-->
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Datenset</strong></label>
<label class="label is-required is-small"><strong>Daten-Auswahl</strong></label>
</div>
<span class="separator"> </span>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<button class="button is-small is-rounded is-white is-outlined"
onClick="fillDataSelectionForm('dataSelectionFormDiv');"><!--is-focused-->
onClick="fillDataSelectionForm('dataSelectionFormDiv');">
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</button>
</div>
<div id="dataSelectionDiv" class="section">
<form name="dataSelectionForm" id="dataSelectionForm">
</div>
<div id="dataSelectionFormDiv" style="display:none">
<div id="dataSelectionDiv"> <!--class="section"-->
<form name="dataSelectionForm" id="dataSelectionForm">
<div id="dataSelectionFormDiv" style="display:none">
<div class="field is-grouped">
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small">Dimension 1</label>
</div>
@ -1345,8 +1357,8 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1345,8 +1357,8 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth is-focused">
<select class="maskinputPflicht" id="dimension1" name="dimension1"><!--tabindex="210">-->
<option class="maskinput" value="" selected="selected">Bitte wählen Sie Dimension 1</option>
<select class="maskinputPflicht" id="dimension1" name="dimension1" tabindex="210">
<option class="maskinput" value="" selected="selected"><!--211122BF Bitte wählen Sie Dimension 1--></option>
</select>
</div>
</p>
@ -1369,8 +1381,8 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1369,8 +1381,8 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth">
<select id="dimension1_fn" name="dimension1_fn"><!-- tabindex="210">-->
<option class="maskinput" value="" selected="selected">Optional: Vordefinierte Transformation</option>
<select id="dimension1_fn" name="dimension1_fn" tabindex="210">
<option class="maskinput" value="" selected="selected">Optional: Vordefinierte Transformation></option>
</select>
</div>
</p>
@ -1386,18 +1398,19 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1386,18 +1398,19 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
</span>
</div>
<div class="field is-grouped">
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small">Dimension 2</label>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth is-focused">
<select class="maskinputPflicht" id="dimension2" name="dimension2"><!--tabindex="210">-->
<option class="maskinput" value="" selected="selected">Bitte wählen Sie Dimension 1</option>
<select class="maskinputPflicht" id="dimension2" name="dimension2" tabindex="210">
<option class="maskinput" value="" selected="selected"><!--211122BFBitte wählen Sie Dimension 2--></option>
</select>
</div>
</p>
@ -1420,7 +1433,7 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1420,7 +1433,7 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth">
<select id="dimension2_fn" name="dimension2_fn"><!-- tabindex="210">-->
<select id="dimension2_fn" name="dimension2_fn" tabindex="210">
<option class="maskinput" value="" selected="selected">Optional: Vordefinierte Transformation</option>
</select>
</div>
@ -1449,8 +1462,8 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1449,8 +1462,8 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth">
<select class="maskinputPflicht" id="measure1" name="measure1"><!-- tabindex="220" >-->
<option class="maskinput" value="" selected="selected">Bitte wählen Sie die Maßangabe</option>
<select class="maskinputPflicht" id="measure1" name="measure1" tabindex="230" >
<option class="maskinput" value="" selected="selected"><!--211122BF Bitte wählen Sie die Maßangabe--></option>
</select>
</div>
</p>
@ -1479,7 +1492,7 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1479,7 +1492,7 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth is-focused">
<select id="measure1_fn" name="measure1_fn"> <!--tabindex="230">-->
<select id="measure1_fn" name="measure1_fn" tabindex="230">
<option class="maskinput" value="" selected="selected">Optional: Vordefinierte Transformation</option>
</select>
</div>
@ -1533,47 +1546,50 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1533,47 +1546,50 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
</tr>
</table>-->
</div>
</form>
</div>
</form>
</div>
<!--Ende Formular Datenauswahl-->
<div id="selectionResultPreview" class="section">
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<!--
<div class="field is-grouped">
<!--Aufruf/Anzeige Daten-Vorschau-->
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Datenvorschau</strong></label>
<label class="label is-required is-small"><strong>Daten-Vorschau</strong></label>
</div>
<span class="separator"> </span>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<button class="button is-small is-rounded is-white is-outlined"
onClick="selectionResultPreview('selectionResultPreviewTable');">
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</button>
</div>-->
<footer class="card-footer">
<p class="card-footer-item"><button class="button is-link is-outlined is-small" onclick="selectionResultPreview('selectionResultPreviewTable');">Vorschau</button></p>
<!--***Selektionsergebnis
<div id="selectionResultPreview" class="section">
<div id="selectionResultPreviewHeader"><input type="button" tabindex="10010" class="sx_buttondiv_submit" value="Laden" onclick="selectionResultPreview('selectionResultPreviewTable');"></div>
<div id="selectionResultPreviewTable" style="border:thin solid black"></div>
</div>
Selektionsergebnis***-->
<p class="card-footer-item"><button class="button is-link is-outlined is-small" type="submit">Speichern</button></p>
<!--****noch anzupassen: <input name="navi" type="hidden" value="true"><input type="hidden" name="tid" value="16000"><input type="hidden" name="UserID" value="4"><input type="hidden" name="reuseresult" value="true"><input type="hidden" name="maxoffset" value=""><input type="hidden" name="contenttype" value="application/jrxml"><input type="hidden" name="irowno" value=""><input type="hidden" name="Köpfe oder Fälle ?" value="studiengang_nr = 1 and fach_nr = 1"><input type="hidden" name="Stichtag" value="6"><input type="hidden" name="Seit Semester" value="20161"><input type="hidden" name="Bis Semester" value="20221"><input type="hidden" name="Studiengang" value=""><input type="hidden" name="Fächer" value=""><input type="hidden" name="Status" value="1,2,3,5,6"><input type="hidden" name="##line##" value="1"><input type="hidden" name="Hörerstatus" value="1=1"><input type="hidden" name="##line##" value="1"><input type="hidden" name="RPTPageOrientation" value="Landscape"><input type="hidden" name="RPTPagination" value="False"></ul>-->
<p class="card-footer-item"><button class="button is-link is-outlined is-small" type="reset">Zurücksetzen</button></p>
</footer>
<div id="selectionResultPreviewTable" style="display:none">
</div>
<div id="selectionResultPreview"> <!--class="section">-->
<div id="selectionResultPreviewTable" style="display:none"></div>
</div>
<!--footer BF: nach unten verschoben-->
<footer class="card-footer">
<!--<p class="card-footer-item"><button class="button is-link is-outlined is-small" onclick="selectionResultPreview('selectionResultPreviewTable');">Daten-Vorschau</button></p>-->
<p class="card-footer-item"><button class="button is-link is-outlined is-small" type="submit">Speichern</button></p>
<p class="card-footer-item"><button class="button is-link is-outlined is-small" type="reset">Zurücksetzen</button></p>
</footer>
</xsl:template>
<xsl:template name="diagrammlayout">
<div id="chartProperties" class="section">
<!--Formular Allg. Layoutmerkmale-->
<div id="chartProperties"> <!--class="section">-->
<form name="chartPropertiesForm">
<table border="0">
<!--<table border="0">
<tr><td>Ausgabetyp:</td>
<td><select class="maskinputPflicht" id="viz_chart_type" NAME="viz_chart_type" tabindex="200" onChange="prepareChartProperties(this.value)" >
<option class="maskinput" value="">Bitte wählen</option>
@ -1585,86 +1601,236 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/> @@ -1585,86 +1601,236 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
</select>
</td>
</tr>
</table>
<hr />
</table>-->
<div class="label-container">
<label class="label is-required is-small"><strong>Allgemeine Layoutmerkmale</strong></label>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Erweiterte Layouteigenschaften</strong></label>
<label class="label is-required is-small">Diagramm-Typ</label>
</div>
<span class="separator"> </span>
<a onClick="showChartPropertiesForm();"><!--is-focused-->
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth">
<select class="maskinputPflicht" id="viz_chart_type" NAME="viz_chart_type" tabindex="200" onChange="prepareChartProperties(this.value)" >
<option class="maskinput" value="" selected="selected">Bitte wählen Sie</option>
<option class="maskinput" value="sample">Beispiel</option>
<option class="maskinput" value="bar_x">Balkendiagramm horizontal (einfach)</option>
<option class="maskinput" value="bar_y">Balkendiagramm vertikal (einfach)</option>
<option class="maskinput" value="line">Liniendiagramm vertikal (einfach)</option>
</select>
</div>
</p>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<span class="info" onclick="window.open('https://super-ics.de/superx/doku/kern_modul/admin/f_Patcheinspielen.htm','_blank','directories=no,location=no,menubar=no,scrollbars=yes,resizable=yes,toolbar=no,width=800,height=660');">
<figure class="image is-24x24">
<img src="../images/information_grey_liberation.svg" />
</figure>
</span>
</a>
</div>
<div id="chartPropertiesForm"> <!--style="visibility:hidden" class="section"--></div>
<!--Ende Formular Allg. Layoutmerkmale-->
<!--<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small">Kategorie-Dimension</label>
</div>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth">
<select class="maskinputPflicht" id="measure1" name="measure1">
<option class="maskinput" value="" selected="selected">Bitte wählen Sie</option>
</select>
</div>
</p>
</div>
<div id="chartPropertiesFormDetails" style="display:none">
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
</div>
<span class="info" onclick="window.open('https://super-ics.de/superx/doku/kern_modul/admin/f_Patcheinspielen.htm','_blank','directories=no,location=no,menubar=no,scrollbars=yes,resizable=yes,toolbar=no,width=800,height=660');">
<figure class="image is-24x24">
<img src="../images/information_grey_liberation.svg" />
</figure>
</span>
</div>
<!-- <div class="field is-grouped">
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Diagramm-Vorschau</strong></label>
<label class="label is-required is-small">Maß</label>
</div>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth">
<select class="maskinputPflicht" id="measure1" name="measure1">
<option class="maskinput" value="" selected="selected">Bitte wählen Sie</option>
</select>
</div>
<span class="separator"> </span>
<a onClick="createChart();" >
</p>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<span class="info" onclick="window.open('https://super-ics.de/superx/doku/kern_modul/admin/f_Patcheinspielen.htm','_blank','directories=no,location=no,menubar=no,scrollbars=yes,resizable=yes,toolbar=no,width=800,height=660');">
<figure class="image is-24x24">
<img src="../images/information_grey_liberation.svg" />
</figure>
</span>
</div> -->
<!--<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small">Serien-Dimension</label>
</div>
<div class="field is-active">
<p class="control-new">
<div class="select is-small is-fullwidth">
<select class="maskinputPflicht" id="measure1" name="measure1" tabindex="220"
<option class="maskinput" value="" selected="selected">Bitte wählen Sie</option>
</select>
</div>
</p>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<span class="info" onclick="window.open('https://super-ics.de/superx/doku/kern_modul/admin/f_Patcheinspielen.htm','_blank','directories=no,location=no,menubar=no,scrollbars=yes,resizable=yes,toolbar=no,width=800,height=660');">
<figure class="image is-24x24">
<img src="../images/information_grey_liberation.svg" />
</figure>
</span>
</div>-->
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<!--Formular Erweiterte Layoutmerkmale-->
<div class="label-container">
<label class="label is-required is-small"><strong>Erweiterte Layoutmerkmale</strong></label>
</div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<a
onClick="showChartPropertiesForm();">
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</a>
</div>
-->
<div id="chartPropertiesFormDetails" style="display:none"><p>Eigenschaften</p> </div>
</form>
</div>
<!--Ende Formular Erweiterte Layoutmerkmale-->
<footer class="card-footer">
<p class="card-footer-item"><button class="button is-link is-outlined is-small" onClick="createChart();">Vorschau</button></p>
<!--***Selektionsergebnis
<div id="selectionResultPreview" class="section">
<div id="selectionResultPreviewHeader"><input type="button" tabindex="10010" class="sx_buttondiv_submit" value="Laden" onclick="selectionResultPreview('selectionResultPreviewTable');"></div>
<div id="selectionResultPreviewTable" style="border:thin solid black"></div>
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<!--Aufruf/Anzeige Layout-Vorschau-->
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Layout-Vorschau</strong></label>
</div>
Selektionsergebnis***-->
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<button class="button is-small is-rounded is-white is-outlined"
onClick="createChart('chartDiv');">
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</button>
</div>
<div id="chartCanvas"> <!--class="section"-->
<!--<div id="chartCanvasHeader"> </div>-->
<div id="chartDiv"> <!--style="border:thin solid black"--></div>
<!--<div id="chartCanvasFooter"></div>-->
</div>
<!--footer (BF nach unten verschoben)-->
<footer class="card-footer">
<!--<p class="card-footer-item"><button class="button is-link is-outlined is-small" onClick="createChart();">Layout-Vorschau</button></p>-->
<p class="card-footer-item"><button class="button is-link is-outlined is-small" type="submit">Speichern</button></p>
<!--****noch anzupassen: <input name="navi" type="hidden" value="true"><input type="hidden" name="tid" value="16000"><input type="hidden" name="UserID" value="4"><input type="hidden" name="reuseresult" value="true"><input type="hidden" name="maxoffset" value=""><input type="hidden" name="contenttype" value="application/jrxml"><input type="hidden" name="irowno" value=""><input type="hidden" name="Köpfe oder Fälle ?" value="studiengang_nr = 1 and fach_nr = 1"><input type="hidden" name="Stichtag" value="6"><input type="hidden" name="Seit Semester" value="20161"><input type="hidden" name="Bis Semester" value="20221"><input type="hidden" name="Studiengang" value=""><input type="hidden" name="Fächer" value=""><input type="hidden" name="Status" value="1,2,3,5,6"><input type="hidden" name="##line##" value="1"><input type="hidden" name="Hörerstatus" value="1=1"><input type="hidden" name="##line##" value="1"><input type="hidden" name="RPTPageOrientation" value="Landscape"><input type="hidden" name="RPTPagination" value="False"></ul>-->
<p class="card-footer-item"><button class="button is-link is-outlined is-small" type="reset">Zurücksetzen</button></p>
</footer>
<div id="chartCanvas" class="section">
<div id="chartCanvasHeader">
</div>
</xsl:template>
<xsl:template name="diagrammnutzung">
<!-- Aufruf/Anzeige Diagramm-Vorschau-->
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>Diagramm-Vorschau</strong></label>
</div>
<div id="chartDiv" style="border:thin solid black">
</div>
<div id="chartCanvasFooter">
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<button class="button is-small is-rounded is-white is-outlined"
onClick="createChart('chartDiv2');">
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</button>
</div>
<div id="chartCanvas"> <!--class="section"-->
<!--<div id="chartCanvasHeader"> </div>-->
<div id="chartDiv2"> </div>
<!--<div id="chartCanvasFooter"></div>-->
</div>
</xsl:template>
<xsl:template name="diagrammnutzung">
<div id="chartSVGsrcDiv" class="section">
<div class="field is-grouped">
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<!-- Aufruf/Anzeige SVG-Quellcode-->
<div class="field is-grouped">
<div class="label-container">
<label class="label is-required is-small"><strong>SVG-Quellcode</strong></label>
<label class="label is-required is-small"><strong>Diagramm-Quellcode (svg)</strong></label>
</div>
<span class="separator"> </span>
<a onClick="showSrcCode();" ><!--is-focused-->
<span class="separator">&#160;</span>
<span class="separator">&#160;</span>
<button class="button is-small is-rounded is-white is-outlined"
onClick="showSrcCode();">
<span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" />
</span>
</a>
</button>
</div>
<div id="chartSVGsrcDiv"> <!--class="section">-->
<div id="chartSVGsrc" style="display:none">
<textarea id="chartSrc" name="chartSrc" class="textarea" placeholder="Quellcode..."> <!--cols="100" rows="20"--></textarea><!--<button class="sx_buttondiv_submit" onClick="copySrcCode('chartSrc');">Kopieren</button>-->
</div>
</div>
<!--footer (BF eingefügt *** Klärungsbedarf bzgl. notwendiger Buttons)-->
<footer class="card-footer">
<!--<p class="card-footer-item"><button class="button is-link is-outlined is-small" onClick="createChart();">Diagramm-Vorschau</button></p> -->
<p class="card-footer-item"><button class="button is-link is-outlined is-small" type="submit" onClick="copySrcCode('chartSrc');">Kopieren</button></p>
<!--<p class="card-footer-item"><button class="button is-link is-outlined is-small" type="reset">Zurücksetzen</button></p>-->
</footer>
<div id="chartSVGsrc" style="visibility:hidden">
<textarea id="chartSrc" name="chartSrc" class="textarea" placeholder="Quellcode..." cols="100" rows="20"></textarea><button class="sx_buttondiv_submit" onClick="copySrcCode('chartSrc');">Kopieren</button>
</div>
</div>
</xsl:template>
</xsl:stylesheet>

Write Preview
Loading…
Cancel
Save