Browse Source

Layout Assistent, Area Chart #5

makro_datasrc
Daniel Quathamer 2 years ago
parent
commit
fbd3190415
  1. 64
      superx/xml/js/viz/viz_functions.js
  2. 36
      superx/xml/viz_html_chart.xsl

64
superx/xml/js/viz/viz_functions.js

@ -150,6 +150,9 @@ function prepareChartProperties(chartType)
case "bar_y": case "bar_y":
chartProperties=prepareBarYForm(); chartProperties=prepareBarYForm();
break; break;
case "area_y":
chartProperties=prepareBarYForm();
break;
case "line": case "line":
chartProperties=prepareLineForm(); chartProperties=prepareLineForm();
break; break;
@ -224,6 +227,10 @@ if(formDivElem.style.display=="none")
var dimFunctions=[]; var dimFunctions=[];
var myFunction= new dimFunction(0,"Wort 1 ans Ende","switchWord1and2ff",false); var myFunction= new dimFunction(0,"Wort 1 ans Ende","switchWord1and2ff",false);
dimFunctions[0]=myFunction; dimFunctions[0]=myFunction;
var myFunction= new dimFunction(1,"Nur Wort 1","justWord1",false);
dimFunctions[1]=myFunction;
var myFunction= new dimFunction(2,"Abkürzen (20)","abbreviate",false);
dimFunctions[2]=myFunction;
selectionProperties=prepareSelectionForm(); selectionProperties=prepareSelectionForm();
for(var k=0;k < selectionProperties.length;k++) for(var k=0;k < selectionProperties.length;k++)
@ -639,7 +646,9 @@ case "bar_x":
case "bar_y": case "bar_y":
makeBarY(selectionRs); makeBarY(selectionRs);
break; break;
case "area_y":
makeAreaY(selectionRs);
break;
case "line": case "line":
makeLine(selectionRs); makeLine(selectionRs);
break; break;
@ -848,6 +857,20 @@ function makeBarY(selectionRs) {
var options= getChartOptions(categoryDim,measureDim,marksArray,true); var options= getChartOptions(categoryDim,measureDim,marksArray,true);
document.getElementById("chartDiv").appendChild(Plot.plot(options));
}
function makeAreaY(selectionRs) {
var categoryDim=document.getElementById("viz_dimension1").value;
var measureDim=document.getElementById("viz_measure1").value;
var marksArray=new Array();
marksArray[0]=Plot.areaY(selectionRs,
{
y: measureDim,
x: categoryDim
});
var options= getChartOptions(categoryDim,measureDim,marksArray,true);
document.getElementById("chartDiv").appendChild(Plot.plot(options)); document.getElementById("chartDiv").appendChild(Plot.plot(options));
} }
function makeLine(selectionRs) { function makeLine(selectionRs) {
@ -1014,6 +1037,12 @@ function applyFunction(theValue,theFunction)
case "switchWord1and2ff": case "switchWord1and2ff":
var ret=switchWord1and2ff(theValue); var ret=switchWord1and2ff(theValue);
break; break;
case "justWord1":
var ret=justWord1(theValue);
break;
case "abbreviate":
var ret=abbreviate(theValue,20);
break;
default: default:
var ret=theValue; var ret=theValue;
break; break;
@ -1042,6 +1071,39 @@ function switchWord1and2ff(theString)
return ret.trim(); return ret.trim();
} }
function justWord1(theString)
{
//nur erstes Wort, zum Sortieren
var word1End=-1;
var i=0;
var endFound=false;
do{
var myChar=theString.substr(i,1);
if(myChar=="|" || myChar==" "|| myChar=="-")
{
endFound=true;
word1End=i;
}
else
i++;
}
while (endFound==false && i<=theString.length);
if(word1End==-1)
word1End=theString.length;
return theString.substr(0,word1End);
}
function abbreviate(theString,theMaxLength)
{
//nur erste x Zeichen
if(theString.length > theMaxLength)
{
var theCut = theString.substr(0,theMaxLength-3)+"...";
return theCut;
}
else return theString.trim();
}
function getColumnCaption(columnName) function getColumnCaption(columnName)
{ {
let rsMetaDataLen = rsMetaData.length; let rsMetaDataLen = rsMetaData.length;

36
superx/xml/viz_html_chart.xsl

@ -1537,19 +1537,31 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
<div id="selectionResultPreview" class="section"> <div id="selectionResultPreview" class="section">
<!--
<div class="field is-grouped"> <div class="field is-grouped">
<div class="label-container"> <div class="label-container">
<label class="label is-required is-small"><strong>Datenvorschau</strong></label> <label class="label is-required is-small"><strong>Datenvorschau</strong></label>
</div> </div>
<span class="separator"> </span> <span class="separator"> </span>
<button class="button is-small is-rounded is-white is-outlined" <button class="button is-small is-rounded is-white is-outlined"
onClick="selectionResultPreview('selectionResultPreviewTable');"><!--is-focused--> onClick="selectionResultPreview('selectionResultPreviewTable');">
<span class="icon is-small"><i class="../images/more.svg"></i> <span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" /> <img src="../images/more.svg" title="Laden" />
</span> </span>
</button> </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> </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 id="selectionResultPreviewTable" style="display:none">
</div> </div>
@ -1566,11 +1578,13 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
<option class="maskinput" value="sample">Beispiel</option> <option class="maskinput" value="sample">Beispiel</option>
<option class="maskinput" value="bar_x">Balkendiagramm horizontal (einfach)</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="bar_y">Balkendiagramm vertikal (einfach)</option>
<option class="maskinput" value="area_y">Flächendiagramm vertikal (einfach)</option>
<option class="maskinput" value="line">Liniendiagramm vertikal (einfach)</option> <option class="maskinput" value="line">Liniendiagramm vertikal (einfach)</option>
</select> </select>
</td> </td>
</tr> </tr>
</table> </table>
<hr />
<div class="field is-grouped"> <div class="field is-grouped">
<div class="label-container"> <div class="label-container">
<label class="label is-required is-small"><strong>Erweiterte Layouteigenschaften</strong></label> <label class="label is-required is-small"><strong>Erweiterte Layouteigenschaften</strong></label>
@ -1590,22 +1604,34 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
</div> </div>
<div class="field is-grouped"> <!-- <div class="field is-grouped">
<div class="label-container"> <div class="label-container">
<label class="label is-required is-small"><strong>Diagramm-Vorschau</strong></label> <label class="label is-required is-small"><strong>Diagramm-Vorschau</strong></label>
</div> </div>
<span class="separator"> </span> <span class="separator"> </span>
<a onClick="createChart();" ><!--is-focused--> <a onClick="createChart();" >
<span class="icon is-small"><i class="../images/more.svg"></i> <span class="icon is-small"><i class="../images/more.svg"></i>
<img src="../images/more.svg" title="Laden" /> <img src="../images/more.svg" title="Laden" />
</span> </span>
</a> </a>
</div> </div>
-->
</form> </form>
</div> </div>
<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>
</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="chartCanvas" class="section"> <div id="chartCanvas" class="section">
<div id="chartCanvasHeader"> <div id="chartCanvasHeader">

Loading…
Cancel
Save