diff --git a/src-modules/module/viz/schluesseltabellen/customxmladd.sql b/src-modules/module/viz/schluesseltabellen/customxmladd.sql index 162c887..2d0ed90 100644 --- a/src-modules/module/viz/schluesseltabellen/customxmladd.sql +++ b/src-modules/module/viz/schluesseltabellen/customxmladd.sql @@ -1,16 +1,5 @@ <#include "MAN_MAKROS"/> select R.catalogue_id,K.shortname,timeunit,sqlchunk,calcratio,decimalplaces,linksub,linktimeline,R.report_id,R.sortnr, R.sortnr2,R.grouping1,G.caption as group_caption from man_catalogue K,man_catalogue_rpt R left outer join man_grouping G on (G.id=R.grouping1) where K.id=R.catalogue_id and R.active=1 and K.id not in ('Bewerber') order by R.sortnr, R.sortnr2 -SELECT tid, - caption, - prop_uniquename, - prop_default, - prop_unit - -FROM viz_property -where is_generic=1 - ; - - SELECT P.tid, P.caption, @@ -24,8 +13,8 @@ P.explanation, P.sortnr, P.range_from, P.range_to, -T.caption as input_type_caption, -T.uniquename as input_type_uniquename, +I.caption as input_type_caption, +I.uniquename as input_type_uniquename, G.caption as group_caption, G.sortnr as group_sortnr, G.uniquename as group_uniquename, @@ -35,12 +24,12 @@ PR.variable_name, P.prop_value_type, P.is_generic -FROM viz_property_input_type T, viz_property P left outer join viz_property_group G +FROM viz_property_input_type I, viz_property P left outer join viz_property_group G on (P.property_group_id=G.tid) left outer join viz_property_group_renderer GR on (GR.property_group_id=G.tid) left outer join viz_renderer R on (R.tid=GR.renderer_id) left outer join viz_property_renderer PR on (P.tid=PR.property_id) -where T.tid=P.input_type_id +where I.tid=P.input_type_id --and P.is_generic=1 order by G.sortnr,G.uniquename,P.sortnr,P.caption ; @@ -70,14 +59,29 @@ order by 3 SELECT T.tid, T.uniquename as viz_type_uniquename, -P.prop_uniquename, P.caption, +P.prop_uniquename, +P.prop_default, +P.prop_unit, +P.is_generic, +P.static_values, +P.is_mandatory, +P.explanation, +P.sortnr, +P.range_from, +P.range_to, +I.caption as input_type_caption, +I.uniquename as input_type_uniquename, G.uniquename as viz_property_group_uniquename, TP.is_mandatory, -TP.sortnr -FROM viz_type T, viz_type_property TP, viz_property P, viz_property_group G +TP.sortnr, +P.prop_value_type, +P.is_generic +FROM viz_type T, viz_type_property TP, viz_property P, +viz_property_input_type I, viz_property_group G where T.tid=TP.viz_type_id and P.tid=TP.viz_property_id +and I.tid=P.input_type_id and G.tid=P.property_group_id order by 2,TP.sortnr,P.caption ; @@ -163,7 +167,15 @@ order by 3 viz_type_uniquename="${tp.viz_type_uniquename}" viz_property_group_uniquename="${tp.viz_property_group_uniquename}" is_mandatory="${tp.is_mandatory}" - sortnr="${tp.sortnr}" + prop_default="${tp.prop_default}" + static_values="${tp.static_values}" + input_type_uniquename="${tp.input_type_uniquename}" + prop_unit="${tp.prop_unit}" + prop_range_from="${tp.range_from}" + prop_range_to="${tp.range_to}" + propValueType="${tp.prop_value_type}" + explanation="${tp.explanation}" + isGeneric="${tp.is_generic}" /> diff --git a/superx/xml/js/viz/viz_functions.js b/superx/xml/js/viz/viz_functions.js index de5621c..80fb08c 100644 --- a/superx/xml/js/viz/viz_functions.js +++ b/superx/xml/js/viz/viz_functions.js @@ -16,9 +16,9 @@ function chartModel(id,name,renderer,datasources) } -function possibleVizType(nr,value,name,explanation,isDefault ) +function possibleVizType(elemID,value,name,explanation,isDefault ) { -this.nr=nr; +this.elemID=elemID; this.value=value; this.name=name; this.explanation=explanation; @@ -26,9 +26,9 @@ this.isDefault=isDefault; } -function usedVizType(nr,vizTypeUniquename,caption,datasource ) +function usedVizType(elemID,vizTypeUniquename,caption,datasource ) { -this.nr=nr; +this.elemID=elemID; this.vizTypeUniquename=vizTypeUniquename; this.caption=caption; this.datasource=datasource; @@ -383,7 +383,19 @@ function createChartElementConfig1Form(renderer,elemID) while (formChartElementConfig1.firstChild) { formChartElementConfig1.removeChild(formChartElementConfig1.firstChild); } - + var formChartElementConfig2=document.getElementById("ChartElementConfig2Div"); + while (formChartElementConfig2.firstChild) { + formChartElementConfig2.removeChild(formChartElementConfig2.firstChild); + } + //reset ElemID: + document.getElementById("chartElementID").value=elemID; + //any previous values? + var myChartElem=null; + if(myChartModel.chartElements && elemID !="") + { + var filtered=myChartModel.chartElements.filter(obj => obj.elemID == elemID); + var myChartElem=filtered[0]; + } //First Datasource: const elementDatasourceDiv=document.createElement("div"); const fieldDatasourceElem = document.createElement("div"); @@ -403,10 +415,10 @@ function createChartElementConfig1Form(renderer,elemID) labelDatasource.appendChild(textnode); labelDatasourceElem.appendChild(labelDatasource); fieldDatasourceElem.appendChild(labelDatasourceElem); - const inpElemId = document.createElement("input"); + /*const inpElemId = document.createElement("input"); inpElemId.name="chartElementID"; inpElemId.id="chartElementID"; - inpElemId.type="hidden"; + inpElemId.type="text";*/ const selDatasourceElem = document.createElement("select"); @@ -418,9 +430,9 @@ function createChartElementConfig1Form(renderer,elemID) selDatasourceElem.onchange= function () { createChartElementsConfig2Form(renderer); }; - fillSelectOptions(selDatasourceElem,rsTableMetaData,true); + fillSelectOptions(selDatasourceElem,rsTableMetaData,true,(myChartElem!=null?myChartElem.datasource:null)); fieldDatasourceElem.appendChild(selDatasourceElem); - fieldDatasourceElem.appendChild(inpElemId); + //fieldDatasourceElem.appendChild(inpElemId); elementDatasourceDiv.appendChild(fieldDatasourceElem); formChartElementConfig1.appendChild(elementDatasourceDiv); @@ -453,14 +465,17 @@ function createChartElementConfig1Form(renderer,elemID) selVizTypeElem.onchange= function () { createChartElementsConfig2Form(renderer); }; - fillSelectOptions(selVizTypeElem,getPossibleVizTypes(renderer),false); + fillSelectOptions(selVizTypeElem,getPossibleVizTypes(renderer),false,(myChartElem!=null?myChartElem.vizTypeUniquename:null)); fieldVizTypeElem.appendChild(selVizTypeElem); elementVizTypeDiv.appendChild(fieldVizTypeElem); formChartElementConfig1.appendChild(elementVizTypeDiv); + //display Element if already saved: + if(elemID!="") + createChartElementsConfig2Form(renderer,elemID); } -function createChartElementsConfig2Form(renderer) +function createChartElementsConfig2Form(renderer,elemID) { var dataSource=document.getElementById("chartElementDatasource").value; var vizType=document.getElementById("chartElementVizType").value; @@ -469,6 +484,8 @@ function createChartElementsConfig2Form(renderer) while (formChartElementConfig2Div.firstChild) { formChartElementConfig2Div.removeChild(formChartElementConfig2Div.firstChild); } + //any previous values? + const elementDivBox = document.createElement("div"); //first only Dimensions and measures: @@ -479,8 +496,39 @@ function createChartElementsConfig2Form(renderer) || vizTypeProperties[k].groupUniquename=="MEASURE" ) ) - elementDivBox.appendChild(renderDimensionField(vizTypeProperties[k],dataSource)); + { + var selectedValue=getChartElementPropertyValue(elemID,vizTypeProperties[k].propUniquename); + elementDivBox.appendChild(renderDimensionField(vizTypeProperties[k],dataSource,selectedValue)); + } + } + + //chartElement-specific properties: + //without Dimensions and measures: + for(var k=0;k < vizTypeProperties.length;k++) + { + if(vizType==vizTypeProperties[k].typeUniquename + && vizTypeProperties[k].groupUniquename!="CATEGORY" + && vizTypeProperties[k].groupUniquename!="MEASURE" + ){ + + var currentCommonChartProperties=commonChartProperties.filter(obj => obj.name == vizTypeProperties[k].propUniquename); + if(currentCommonChartProperties.length >0) + { + //var selectedValue=getChartElementPropertyValue(elemID,currentCommonChartProperties[0].propUniquename); + + elementDivBox.appendChild(renderChartPropertyField(elemID,currentCommonChartProperties[0],false)); + } + else + { + const unknownFieldDiv = document.createElement("div"); + const unknownField=document.createTextNode("Unbekanntes Feld "+vizTypeProperties[k].propUniquename); + unknownFieldDiv.appendChild(unknownField); + elementDivBox.appendChild(unknownFieldDiv); + } + + } } + const saveBtnDiv = document.createElement("div"); const saveBtn = document.createElement("input"); saveBtn.type="BUTTON"; @@ -496,35 +544,60 @@ function createChartElementsConfig2Form(renderer) formChartElementConfig2Div.appendChild(elementDivBox); - /*columnsDiv.appendChild(columnDiv); - //title - const columnDivTitle = document.createElement("div"); - columnDivTitle.classList.add("column"); - columnDivTitle.classList.add("is-narrow"); - const columnDivBoxTitle = document.createElement("div"); - columnDivBoxTitle.classList.add("box"); - columnDivBoxTitle.style="width: 500px"; - for(var k=0;k < myCommonChartProperties.length;k++) + +} +function getChartElementPropertyValue(elemID,propUniquename) +{ + var retVal=null; + var myChartElem=null; + if(myChartModel.chartElements && elemID !=null) + { + var filtered=myChartModel.chartElements.filter(obj => obj.elemID == elemID); + var myChartElem=filtered[0]; + if(myChartElem.elementTypeProperties && myChartElem.elementTypeProperties.length) { - if(myCommonChartProperties[k].name=="caption") - columnDivBoxTitle.appendChild(renderChartPropertyField(myCommonChartProperties[k])); + for(var k=0;k < myChartElem.elementTypeProperties.length;k++) + { + myVizTypeProperty=myChartElem.elementTypeProperties[k]; + if(myVizTypeProperty.vizTypePropertyUniquename==propUniquename) + { + retVal=myVizTypeProperty.propertyValue; + } + } } - - columnDivTitle.appendChild(columnDivBoxTitle); - columnsDiv.appendChild(columnDivTitle); - myForm.appendChild(columnsDiv); - */ + } + return retVal; +} +function loadChartElementConfig(myElem) +{ + var elemID=myElem.value; + if(elemID=="") + alert("Kein Grafikelement gefunden"); + else + { + var renderer=document.getElementById("fldVizRenderer").value; + var myVizType=myChartModel.chartElements[elemID]; + createChartElementConfig1Form(renderer,elemID); + //document.getElementById("chartElementVizType").value=myVizType.vizTypeUniquename; + //document.getElementById("chartElementDatasource").value=myVizType.datasource; + } } - function saveChartElementConfig() { var elemID=document.getElementById("chartElementID").value; var vizTypeUniquename=document.getElementById("chartElementVizType").value; var datasource=document.getElementById("chartElementDatasource").value; - + var nextElemID=parseInt(document.getElementById("vizElementCounter").value) +1; + var mode="update"; if(elemID=="") - elemID=0; - + { + //insert mode: + mode="insert"; + if(myChartModel.chartElements) + elemID=myChartModel.chartElements.length +1; + else + elemID="0"; + } var myVizType=new usedVizType(elemID,vizTypeUniquename,vizTypeUniquename,datasource); //nr,vizTypeUniquename,caption,datasource var propertyCounter=0; for(var k=0;k < vizTypeProperties.length;k++) @@ -533,22 +606,27 @@ function saveChartElementConfig() && document.getElementById(vizTypeProperties[k].propUniquename) && document.getElementById(vizTypeProperties[k].propUniquename).value !="") { - var myUsedVizTypeProperty=new usedVizTypeProperty(propertyCounter,vizTypeProperties[k].propUniquename, vizTypeProperties[k].caption,document.getElementById(vizTypeProperties[k].propUniquename).value); //))nr,vizTypePropertyUniquename,caption,propertyValue ) + var myUsedVizTypeProperty=new usedVizTypeProperty(elemID,vizTypeProperties[k].propUniquename, vizTypeProperties[k].caption,document.getElementById(vizTypeProperties[k].propUniquename).value); //))nr,vizTypePropertyUniquename,caption,propertyValue ) myVizType.elementTypeProperties.push(myUsedVizTypeProperty); } } //myVizType.elementTypeProperties=null; //TODO: Existenz abfangen, hier wird einfach hinzugefügt: - myChartModel.chartElements.push(myVizType); - //Reset Elements Form - elemID++; - document.getElementById("chartElementID").value=elemID; - document.getElementById("chartElementVizType").value=""; - var formChartElementConfig2Div=document.getElementById("ChartElementConfig2Div"); - while (formChartElementConfig2Div.firstChild) { - formChartElementConfig2Div.removeChild(formChartElementConfig2Div.firstChild); - } - document.getElementById("vizElementCounter").value=myChartModel.chartElements.length; + if(mode=="update") + { + for(var k=0;k0) + var elemID=document.getElementById("chartElementID").value; + if(elemID!="") { - var elemID=myChartModel.chartElements[propertyCounter-1].nr; - - /*var filtered=myChartModel.chartElements.filter(obj => obj.nr !== propertyCounter-1); - myChartModel.chartElements=filtered;*/ - myChartModel.chartElements.pop(); - elemID--; - if(document.getElementById("chartElementID")) - document.getElementById("chartElementID").value=elemID; + var renderer=document.getElementById("fldVizRenderer").value; + var filtered=myChartModel.chartElements.filter(obj => obj.elemID != elemID); + myChartModel.chartElements=filtered; + //myChartModel.chartElements.pop(); + //elemID--; + //if(document.getElementById("chartElementID")) + // document.getElementById("chartElementID").value=elemID; document.getElementById("vizElementCounter").value=myChartModel.chartElements.length; + const chartElementListSelect=document.getElementById("chartElementID"); + fillChartElementListSelect(chartElementListSelect); + createChartElementConfig1Form(renderer,null); renderChart('chartDiv',myChartModel); } } +function fillChartElementListSelect(mySelectElem,selectedValue) +{ + var chartElementListSelectOptionArray=new Array(); + if(myChartModel.chartElements.length>0) + { + + for(var k=0;k < myChartModel.chartElements.length;k++) + { + var myOptionValue=new possibleVizType(myChartModel.chartElements[k].elemID, + myChartModel.chartElements[k].elemID, + myChartModel.chartElements[k].vizTypeUniquename + "-"+myChartModel.chartElements[k].datasource, + "", //explanation + (myChartModel.chartElements[k].elemID==selectedValue ? true:false) //isDefault + ); + chartElementListSelectOptionArray.push(myOptionValue); + } + } + fillSelectOptions(mySelectElem,chartElementListSelectOptionArray,false,selectedValue); + +} + +function showChartElementsBodyForm(elemID) +{ + //Reset Elements Form + //elemID++; + var filtered=myChartModel.chartElements.filter(obj => obj.elemID == elemID); + + document.getElementById("chartElementID").value=elemID; + document.getElementById("chartElementVizType").value=filtered[0].vizTypeUniquename; + var formChartElementConfig2Div=document.getElementById("ChartElementConfig2Div"); + while (formChartElementConfig2Div.firstChild) { + formChartElementConfig2Div.removeChild(formChartElementConfig2Div.firstChild); + } + +} + function resetChartPropertiesForm(chosenRenderer) { myChartModel=new chartModel(1,"",document.getElementById("fldVizRenderer").value,rsTableMetaData); @@ -621,13 +737,16 @@ function fillDimensionProperty(vizTypeProperty,datasource) } function showChartPropertiesFormDiv(formDiv,formElementsDiv,renderer) { + if(myChartModel != null) + { var myDiv=document.getElementById(formDiv); switch (formDiv) { case "generalChartPropertiesFormDiv": - renderGeneralChartPropertiesForm(formElementsDiv,commonChartProperties,renderer); + renderGeneralChartPropertiesForm(formElementsDiv,commonChartProperties,myChartModel.renderer); break; - case "ChartElementDiv": + case "ChartElementsDiv": + createChartElementConfig1Form(myChartModel.renderer,null); break; default: //do nothing @@ -639,7 +758,7 @@ function showChartPropertiesFormDiv(formDiv,formElementsDiv,renderer) myDiv.style.display="none"; else myDiv.style.display="block"; - +} } function showSaveChartFormDiv(formDiv,renderer) @@ -1012,7 +1131,7 @@ function fillSelectionResult(selectionRsMetaData) } -function renderDimensionField(vizTypeProperty,datasource) +function renderDimensionField(vizTypeProperty,datasource,selectedValue) { const fieldElem = document.createElement("div"); fieldElem.classList.add("field"); @@ -1047,7 +1166,7 @@ function renderDimensionField(vizTypeProperty,datasource) renderChart('chartDiv'); };*/ var dimensionProperty=fillDimensionProperty(vizTypeProperty,datasource); - fillSelectOptions(selElem,dimensionProperty.getValueResultset(),dimensionProperty.isMandatory); + fillSelectOptions(selElem,dimensionProperty.getValueResultset(),dimensionProperty.isMandatory,selectedValue); inputSelectElem.appendChild(selElem); inputFieldElem.appendChild(inputSelectElem); fieldElem.appendChild(inputFieldElem); @@ -1071,7 +1190,7 @@ function renderGeneralChartPropertiesForm(formDiv,myCommonChartProperties,render if(groupUniquename!="" && groupUniquename != previousGroup && myCommonChartProperties[k].groupVariableName !="" - && isChartPropertyValidForChartelements(myCommonChartProperties[k]) + //&& isChartPropertyValidForChartelements(myCommonChartProperties[k]) ) { var newcommonChartPropertyGroup = new commonChartPropertyGroup(myCommonChartProperties[k].groupCaption,groupUniquename,""); @@ -1086,7 +1205,7 @@ function renderGeneralChartPropertiesForm(formDiv,myCommonChartProperties,render const columnGroupDiv = document.createElement("div"); columnGroupDiv.id=commonChartPropertyGroups[i].groupUniquename; - columnGroupDiv.classList.add("box"); + columnGroupDiv.classList.add("block"); const columnGroupHeaderDiv = document.createElement("div"); const colHeader = document.createTextNode(commonChartPropertyGroups[i].caption); @@ -1117,33 +1236,20 @@ function renderGeneralChartPropertiesForm(formDiv,myCommonChartProperties,render { if(myCommonChartProperties[k].groupUniquename==commonChartPropertyGroups[i].groupUniquename && myCommonChartProperties[k].variableName!="" - && isChartPropertyValidForChartelements(myCommonChartProperties[k])) - columnGroupBodyDiv.appendChild(renderChartPropertyField(myCommonChartProperties[k])); + //&& isChartPropertyValidForChartelements(myCommonChartProperties[k]) + ) + columnGroupBodyDiv.appendChild(renderChartPropertyField(null,myCommonChartProperties[k],true)); } columnGroupDiv.appendChild(columnGroupBodyDiv); columnDiv.appendChild(columnGroupDiv); } myForm.appendChild(columnDiv); - /*alte Liste flach: - const divBox = document.createElement("div"); - for(var k=0;k < myCommonChartProperties.length;k++) - { - if((myCommonChartProperties[k].groupVariableName=="layout" - || myCommonChartProperties[k].groupVariableName=="style" - || myCommonChartProperties[k].groupVariableName=="x" - || myCommonChartProperties[k].groupVariableName=="y" - || myCommonChartProperties[k].groupVariableName=="color" - ) - && myCommonChartProperties[k].rendererUniquename==renderer) - divBox.appendChild(renderChartPropertyField(myCommonChartProperties[k])); - } - - myForm.appendChild(divBox); - */ } + + function isChartPropertyValidForChartelements(prop) { var propValid=false; @@ -1175,15 +1281,24 @@ function toggleGroupBodyDiv(groupBodyDiv) } -function renderChartPropertyField(commonChartProperty) +function renderChartPropertyField(elemID,chartProperty,isCommon) { - //Wenn im chartModel schon ein Wert vorhanden ist, wird er vorbelegt: if(commonChartProperty) + //Wenn im chartModel schon ein Wert vorhanden ist, wird er vorbelegt: if(chartProperty) var propValue=""; - if(myChartModel && myChartModel.chartPropertiesUsed.length>0) + if(myChartModel && isCommon && myChartModel.chartPropertiesUsed.length>0) { - propValue=getCommonChartPropertyFromModel(myChartModel.chartPropertiesUsed,commonChartProperty.name ); + propValue=getChartPropertyFromModel(myChartModel.chartPropertiesUsed,chartProperty.name,isCommon ); } + if(myChartModel && !isCommon && myChartModel.chartElements.length >0) + { + var filtered=myChartModel.chartElements.filter(obj => obj.elemID == elemID); + var myChartElem=filtered[0]; + if(myChartElem && myChartElem.elementTypeProperties && myChartElem.elementTypeProperties.length) + { + propValue=getChartPropertyFromModel(myChartElem.elementTypeProperties,chartProperty.name,isCommon ); + } + } const fieldElem = document.createElement("div"); fieldElem.classList.add("field"); fieldElem.classList.add("is-grouped"); @@ -1195,31 +1310,31 @@ function renderChartPropertyField(commonChartProperty) label.classList.add("is-required"); label.classList.add("is-small"); label.classList.add("has-tooltip-right"); - label.setAttribute("data-tooltip",commonChartProperty.explanation); + label.setAttribute("data-tooltip",chartProperty.explanation); - const textnode = document.createTextNode(commonChartProperty.caption); + const textnode = document.createTextNode(chartProperty.caption); label.appendChild(textnode); labelElem.appendChild(label); fieldElem.appendChild(labelElem); //input: + const inputControlElem = document.createElement("div"); + inputControlElem.classList.add("control-new"); const inputFieldElem = document.createElement("div"); inputFieldElem.classList.add("field"); - const inputParaElem = document.createElement("p"); - inputParaElem.classList.add("control-new"); const inputElem = document.createElement("div"); inputElem.classList.add("is-small"); //inputElem.classList.add("is-fullwidth"); - switch (commonChartProperty.inputType) { + switch (chartProperty.inputType) { case "SELECT": //select input: inputElem.classList.add("select"); inputElem.classList.add("is-small"); const selElem = document.createElement("select"); - selElem.name=commonChartProperty.name; - selElem.id=commonChartProperty.name; + selElem.name=chartProperty.name; + selElem.id=chartProperty.name; //selElem.style="width:50px"; - if(commonChartProperty.variableName=="") + if(chartProperty.variableName=="") { selElem.disabled="disabled"; selElem.readonly="readonly"; @@ -1229,10 +1344,10 @@ function renderChartPropertyField(commonChartProperty) updateChartModel(); renderChart('chartDiv',myChartModel); }; - fillSelectOptions(selElem,commonChartProperty.getValueResultset(),commonChartProperty.isMandatory); - selElem.value= (propValue=="")?commonChartProperty.defaultValue:propValue; + fillSelectOptions(selElem,chartProperty.getValueResultset(),chartProperty.isMandatory,propValue); + selElem.value= (propValue=="")?chartProperty.defaultValue:propValue; inputElem.appendChild(selElem); - inputParaElem.appendChild(inputElem); + inputFieldElem.appendChild(inputElem); break; case "TEXTAREA": @@ -1240,20 +1355,20 @@ function renderChartPropertyField(commonChartProperty) const textAreaElem = document.createElement("textarea"); textAreaElem.cols="20"; textAreaElem.rows=3; - if(commonChartProperty.variableName=="") + if(chartProperty.variableName=="") { textAreaElem.disabled="disabled"; textAreaElem.readonly="readonly"; } - textAreaElem.name=commonChartProperty.name; - textAreaElem.id=commonChartProperty.name; - textAreaElem.value= (propValue=="")?commonChartProperty.defaultValue:propValue; + textAreaElem.name=chartProperty.name; + textAreaElem.id=chartProperty.name; + textAreaElem.value= (propValue=="")?chartProperty.defaultValue:propValue; textAreaElem.onchange= function () { updateChartModel(); renderChart('chartDiv',myChartModel); }; inputElem.appendChild(textAreaElem); - inputParaElem.appendChild(inputElem); + inputFieldElem.appendChild(inputElem); break; case "RANGE": @@ -1262,7 +1377,7 @@ function renderChartPropertyField(commonChartProperty) const rangeElem = document.createElement("input"); rangeElem.type="NUMBER"; rangeElem.size=5; - if(commonChartProperty.variableName=="") + if(chartProperty.variableName=="") { rangeElem.disabled="disabled"; rangeElem.readonly="readonly"; @@ -1270,58 +1385,58 @@ function renderChartPropertyField(commonChartProperty) /* klappt noch nicht: rangeElem.type="RANGE"; - rangeElem.min=commonChartProperty.range_from; - rangeElem.max=commonChartProperty.range_to; + rangeElem.min=chartProperty.range_from; + rangeElem.max=chartProperty.range_to; rangeElem.step=50; */ - rangeElem.name=commonChartProperty.name; - rangeElem.id=commonChartProperty.name; - rangeElem.value= (propValue=="")?commonChartProperty.defaultValue:propValue; + rangeElem.name=chartProperty.name; + rangeElem.id=chartProperty.name; + rangeElem.value= (propValue=="")?chartProperty.defaultValue:propValue; rangeElem.onchange= function () { updateChartModel(); renderChart('chartDiv',myChartModel); }; inputElem.appendChild(rangeElem); - inputParaElem.appendChild(inputElem); + inputFieldElem.appendChild(inputElem); break; default: //Einfaches Texteingabefeld: const inpElem = document.createElement("input"); inpElem.type="TEXT"; - if(commonChartProperty.propValueType=="integer") + if(chartProperty.propValueType=="integer") inpElem.type="NUMBER"; - if(commonChartProperty.inputType=="COLOR") + if(chartProperty.inputType=="COLOR") inpElem.type="color"; inpElem.size=5; - if(commonChartProperty.variableName=="") + if(chartProperty.variableName=="") { inpElem.disabled="disabled"; inpElem.readonly="readonly"; } - inpElem.name=commonChartProperty.name; - inpElem.id=commonChartProperty.name; - inpElem.value= (propValue=="")?commonChartProperty.defaultValue:propValue; + inpElem.name=chartProperty.name; + inpElem.id=chartProperty.name; + inpElem.value= (propValue=="")?chartProperty.defaultValue:propValue; inpElem.onchange= function () { updateChartModel(); renderChart('chartDiv',myChartModel); }; inputElem.appendChild(inpElem); - inputParaElem.appendChild(inputElem); + inputFieldElem.appendChild(inputElem); break; } - inputFieldElem.appendChild(inputParaElem); - fieldElem.appendChild(inputFieldElem); + inputControlElem.appendChild(inputFieldElem); + fieldElem.appendChild(inputControlElem); return fieldElem; } -function fillSelectOptions(myCombo,myValues,isMandatory) +function fillSelectOptions(myCombo,myValues,isMandatory,selectedValue) { var optionCounter=0; var selectedOption=null; @@ -1339,8 +1454,10 @@ if(!isMandatory) } for(var j=0;j < myValues.length;j++) { - if(myValues[j].isDefault) - selectedOption=optionCounter; + if(myValues[j].value==selectedValue) + selectedOption=j+(isMandatory?0:1); + if(selectedOption==null && myValues[j].isDefault) + selectedOption=j+(isMandatory?0:1); var o=new Option(myValues[j].name,myValues[j].value,null,null); myCombo.options[optionCounter]=o; @@ -1684,8 +1801,8 @@ function renderChartElementWithD3(currentChartModel,chartElemNr,targetDiv) // append the svg canvas to the page var margin = { top: 10, right: 10, bottom: 10, left: 10 }, //var margin = { top: 0, right: 50, bottom: 0, left: 0 }, - width = getCommonChartPropertyFromModel(currentChartModel.chartPropertiesUsed,"width") - margin.left - margin.right, - height = getCommonChartPropertyFromModel(currentChartModel.chartPropertiesUsed,"height") - margin.top - margin.bottom; + width = getChartPropertyFromModel(currentChartModel.chartPropertiesUsed,"width") - margin.left - margin.right, + height = getChartPropertyFromModel(currentChartModel.chartPropertiesUsed,"height") - margin.top - margin.bottom; var clearCanvas=document.getElementById(targetDiv); while (clearCanvas.firstChild) { @@ -2086,17 +2203,20 @@ function getChartPropertyValue(propArray,propName) } return propertyValue; } -function getCommonChartPropertyFromModel(myCommonChartProperties,name) +function getChartPropertyFromModel(myChartProperties,name,isCommon) { var propertyValue=""; - if(myCommonChartProperties && myCommonChartProperties.length>0) + if(myChartProperties && myChartProperties.length>0) { - let prop = myCommonChartProperties.find(o => o.name === name); + let prop = myChartProperties.find(o => o.name === name); + if(!prop) + prop = myChartProperties.find(o => o.vizTypePropertyUniquename == name); + if(prop) propertyValue=prop.propertyValue; } //if no value is set from model, retrieve the default value: - if(propertyValue=="") + if(propertyValue=="" && isCommon) propertyValue=getCommonChartProperty(name); @@ -2247,13 +2367,14 @@ if(myJsonString!="") if(myChartModel) { document.getElementById("vizElementCounter").value=myChartModel.chartElements.length; - renderChart(chartDiv,myChartModel) + renderChart(chartDiv,myChartModel); + fillChartElementListSelect(document.getElementById("chartElementID"),null); } } +} -} function copySrcCode(mydiv) { var ergtabelle=document.getElementById(mydiv); @@ -2402,7 +2523,7 @@ for (let i = 1; i < 4; i++) { function makeWorldmapD3(myCommonChartProperties,mySvg,data,metaData,chartElem) { // load the data -var captionEmptyTarget=getCommonChartPropertyFromModel(myCommonChartProperties,"null_value_mask"); +var captionEmptyTarget=getChartPropertyFromModel(myCommonChartProperties,"null_value_mask"); renderWorldMap(myCommonChartProperties,mySvg,data); } @@ -2484,7 +2605,7 @@ return myData; function makeSankeyD3(myCommonChartProperties,mySvg,data,metaData,chartElem) { // load the data -var captionEmptyTarget=getCommonChartPropertyFromModel(myCommonChartProperties,"null_value_mask"); +var captionEmptyTarget=getChartPropertyFromModel(myCommonChartProperties,"null_value_mask"); if(captionEmptyTarget=="") captionEmptyTarget="Leer"; var sNodes=getSankeyNodes(data,captionEmptyTarget); //graph.nodes; @@ -2602,19 +2723,19 @@ function renderSankey(myCommonChartProperties,svg,sNodes,sLinks) // set the dimensions and margins of the graph var margin = { top: 10, right: 10, bottom: 10, left: 10 }, //var margin = { top: 0, right: 50, bottom: 0, left: 0 }, - width = getCommonChartPropertyFromModel(myCommonChartProperties,"width") - margin.left - margin.right, - height = getCommonChartPropertyFromModel(myCommonChartProperties,"height") - margin.top - margin.bottom; + width = getChartPropertyFromModel(myCommonChartProperties,"width") - margin.left - margin.right, + height = getChartPropertyFromModel(myCommonChartProperties,"height") - margin.top - margin.bottom; // format variables var formatNumber = d3.format(",.0f"), // zero decimal places format = function (d) { return formatNumber(d); }, color = d3.scaleOrdinal().range(["#002060ff", "#164490ff", "#4d75bcff", "#98b3e6ff", "#d5e2feff", "#008cb0ff"]); -var textColor=getCommonChartPropertyFromModel(myCommonChartProperties,"color"); +var textColor=getChartPropertyFromModel(myCommonChartProperties,"color"); if(textColor=="") textColor="#3f3f3f"; -var fontSize=getCommonChartPropertyFromModel(myCommonChartProperties,"fontSize"); +var fontSize=getChartPropertyFromModel(myCommonChartProperties,"fontSize"); if(fontSize=="") fontSize="12pt"; -var fontFamily=getCommonChartPropertyFromModel(myCommonChartProperties,"fontFamily"); +var fontFamily=getChartPropertyFromModel(myCommonChartProperties,"fontFamily"); if(fontFamily=="") fontFamily="sans-serif"; // append the svg object to the body of the page diff --git a/superx/xml/viz_components.xsl b/superx/xml/viz_components.xsl index c471ff1..eeb7d7b 100644 --- a/superx/xml/viz_components.xsl +++ b/superx/xml/viz_components.xsl @@ -533,4 +533,103 @@ and (@renderer_uniquename='plot' or @renderer_uniquename='d3js') ]"> - - - +

@@ -201,104 +162,96 @@ Formel: ANZ / 2 kaufm. gerundet + + + + +
+
+
+Platzhalter +
+
+

+ +Vergrößern ... + + +Mehr Infos ... + +

+ + + +
+ - - + + + + + diff --git a/test/webapps_superx/test_viz/stud_zeitreihe.html b/test/webapps_superx/test_viz/stud_zeitreihe.html new file mode 100644 index 0000000..ccc2d95 --- /dev/null +++ b/test/webapps_superx/test_viz/stud_zeitreihe.html @@ -0,0 +1,2692 @@ + + + + + + + + + + + + + Tabelle Studierende nach Erst- und Neueinschreibung (Zeitreihe) + + + + + + +
+
+
+
+
+
+
+ +

+
+
+
+
+

Konfigurationsassistent Datenvisualisierung

+ +
+
+

Studierende nach Erst- und Neueinschreibung (Zeitreihe)

+ +

Köpfe oder Fälle ?:  + Köpfe + ; + Stichtag:  + Aktuelle Zahlen + ; + Seit Semester:  + WiSe 2013/2014 + ; + Bis Semester:  + SoSe 2024 + ; + Status:  + Alle ohne Beurl. + ; + Hörerstatus:  + alle + ; + + User: superx  + Stand: + 10.05.2024

  +
+
  
+
+
+
   
+

+

+
+
+ + +
+
+
+
+
+ +
+
+
+
+
+
+
+ + \ No newline at end of file diff --git a/test/webapps_superx/test_viz/stud_zeitreihe_plot.html b/test/webapps_superx/test_viz/stud_zeitreihe_plot.html new file mode 100644 index 0000000..fe500ca --- /dev/null +++ b/test/webapps_superx/test_viz/stud_zeitreihe_plot.html @@ -0,0 +1,2719 @@ + + + + + + + + + + + + + Tabelle Studierende nach Erst- und Neueinschreibung (Zeitreihe) + + + + + + +
+
+
+
+
+
+
+ +

+
+
+
+
+

Konfigurationsassistent Datenvisualisierung

+ +
+
+

Studierende nach Erst- und Neueinschreibung (Zeitreihe)

+ +

Köpfe oder Fälle ?:  + Köpfe + ; + Stichtag:  + Aktuelle Zahlen + ; + Seit Semester:  + WiSe 2013/2014 + ; + Bis Semester:  + SoSe 2024 + ; + Status:  + Alle ohne Beurl. + ; + Hörerstatus:  + alle + ; + + User: superx  + Stand:

+
+
  
+
+
+
   +
+
+
+
+
+
+
+
+
+

+

+

+
   +
+
  
+
+
+
+

+

+

+
   +
+
+
+
+
+ + GO +
+
+
  
+
+
+
+ +
+ +
+
+
+
+
  
+

+ +
+
+ +
+
+
+
+
+ +
+
+
+
+
+
+
+ + \ No newline at end of file