diff --git a/src-modules/module/viz/conf/viz.xml b/src-modules/module/viz/conf/viz.xml index 0bc87be..de1191f 100644 --- a/src-modules/module/viz/conf/viz.xml +++ b/src-modules/module/viz/conf/viz.xml @@ -14,7 +14,7 @@ rightname="CS_BIA_STANDARDREPORTS_ADMIN[VIZ]" /> Schlüsseltabelle für Arten von Visualisierungen - + @@ -175,6 +175,7 @@ rightname="CS_BIA_STANDARDREPORTS_ADMIN[VIZ]" /> Wir nur bei Schiebereglern genutzt Wir nur bei Schiebereglern genutzt + string,integer,float,boolean @@ -198,9 +199,8 @@ rightname="CS_BIA_STANDARDREPORTS_ADMIN[VIZ]" /> Schlüsseltabelle für Eigenschaften von Visualisierungstypen - - - + + 1=ja, 0=nein @@ -267,7 +267,45 @@ rightname="CS_BIA_STANDARDREPORTS_ADMIN[VIZ]" /> - + + View Eigenschaften für Dimensionen und Maße + + + + + + + 1=ja, 0=nein + wird nur bei SELECT-Feldern genutzt, mit "|" getrennt + 1=ja, 0=nein + + + Wird als Tooltip angezeigt + + Wir nur bei Schiebereglern genutzt + Wir nur bei Schiebereglern genutzt + + + @@ -344,6 +382,10 @@ parent="Masken verwalten">Abfragen zur Administration von Visualisierungen + + + @@ -418,7 +460,7 @@ parent="Masken verwalten">Abfragen zur Administration von Visualisierungen + +
+In diesem Formular können Sie Diagrammtypen verwalten. Im Details-Formular können Sie Eigenschaften zuordnen. + + + + + + + + + +
+In diesem Formular können Sie Diagramme verwalten. + +tid + + + + + + + + + + + + + + + +
+ @@ -542,13 +639,14 @@ mode="full"> path="/edit/viz/viz_property_group_edit.jsp" followUp="" caption="Diagrammgruppen-Eigenschaften verwalten" - orderBy="name" + orderBy="caption" gotoHt="" helpfile="" maxRows="1" mode="full"> In diesem Formular können Sie Gruppen von Diagrammeigenschaften verwalten. +tid diff --git a/src-modules/module/viz/masken/44000_felderinfo.unl b/src-modules/module/viz/masken/44000_felderinfo.unl index 2559f5d..f385325 100644 --- a/src-modules/module/viz/masken/44000_felderinfo.unl +++ b/src-modules/module/viz/masken/44000_felderinfo.unl @@ -5,4 +5,4 @@ 44004^Komponente^1^0^0^150^200^1^integer^200^0^13^<> select tid,name from systeminfo order by 2;^ ^^ 44005^Eigenschaftsgruppen verwalten^200^0^0^150^300^1^char^30^0^18^^^<> select '../edit/viz/viz_property_group_list.jsp' from xdummy;^ 44006^Projekt^5^0^0^150^200^1^integer^200^0^13^<> select tid,name from qa_project where active=1 /* and systeminfo_id=<> */ order by 2;^^^ -44007^Status Test^200^0^0^150^200^1^integer^200^0^13^<> select 1,'nur aktive' from xdummy union select 0,'nur inaktive' from xdummy order by 2;^^ ^ +44007^Diagrammtypen verwalten^220^0^0^150^200^1^char^200^0^18^ ^^<> select '../edit/viz/viz_type_list.jsp' from xdummy;^ diff --git a/src-modules/module/viz/schluesseltabellen/viz_property.unl b/src-modules/module/viz/schluesseltabellen/viz_property.unl index 7388f8b..faa3ba2 100644 --- a/src-modules/module/viz/schluesseltabellen/viz_property.unl +++ b/src-modules/module/viz/schluesseltabellen/viz_property.unl @@ -1,33 +1,42 @@ -1^Diagramm-Höhe^height^400^px^1^ ^0^4^10^(Wird nur ausgewertet wenn es keine Y-Achse gibt)^101^^^ -2^Diagramm-Breite^width^500^px^1^ ^0^4^10^Äußere Breite des Diagramms inkl. Ränder^102^100^2000^ -3^Werte-Label-Breite^valueLabelWidth^20^px^1^^0^1^18^^^^^ -4^Hintergrundfarbe^backgroundColor^#ccffcc^ ^1^#ffffeb^0^3^11^ ^201^^^ -5^Vordergrundfarbe^color^black^ ^1^black^0^3^11^Text- und Diagrammelemente^202^^^ -6^Schriftgröße^fontSize^10^px^1^ ^0^4^11^Text- und Diagrammelemente^204^^^ -7^Schriftfamilie^fontFamily^serif^ ^1^serif|sans-serif|monospace|system_ui^0^2^11^ ^203^^^ -8^Flächenfarbe^fill^blue^ ^1^blue|red|brand^0^2^12^relevant für Flächen,Balken, Säulen, Streifen, Punkte^305^^^ -11^Kat: Schriftneigung^tickRotate^-45^ ^1^ ^0^1^18^ ^604^^^ -12^Kat: Skalierung^ticks^5^ ^1^ ^0^1^18^ ^605^^^ -13^Kat: Schriftgröße^tickSize^10^ ^1^ ^0^1^18^ ^603^^^ -15^Kat: Label-Ausrichtung^labelAnchor^center^ ^1^left|center|right^0^2^18^ ^601^^^ -16^Außenrand links^marginLeft^50^px^1^ ^0^4^10^ ^103^^^ -17^Außenrand rechts^marginRight^50^px^1^ ^0^4^10^ ^104^^^ -18^Außenrand oben^marginTop^50^px^1^ ^0^4^10^ ^105^^^ -19^Außenrand unten^marginBottom^50^px^1^ ^0^4^10^ ^106^^^ -20^Innenrand oben^insetTop^0^px^1^ ^0^4^10^ ^107^^^ -21^Innenrand unten^insetBottom^0^px^1^ ^0^4^10^ ^108^^^ -22^Innenrand links^insetLeft^0^px^1^ ^0^4^10^ ^109^^^ -23^Innenrand rechts^insetRight^0^px^1^ ^0^4^10^ ^110^^^ -24^Farbschema^scheme^ ^ ^1^blues|greens|greys|oranges|purples|reds^0^2^12^ ^303^^^ -25^Farbtyp^type^ ^ ^1^einfarbig|mehrfarbig|zyklisch^0^2^12^ ^302^^^ -43^Farbsättigung^fillOpacity^0,5^ ^1^ ^0^4^12^ ^306^^^ -44^Strichfarbe^stroke^ ^ ^1^ ^0^1^12^sfsfsdf^307^^^ -45^Strichdicke^strokeWidth^ ^ ^1^ ^0^1^12^^308^^^ -56^Fortlaufende Skala^continous scales^ ^ ^1^identity|linear|log|pow|sqrt|symlog^0^2^15^ ^401^^^ -57^Kategorie-Skala^categorical scales^ ^ ^1^point|band^0^2^15^ ^402^^^ -58^Datums-Skala^date scales^ ^ ^1^time|utc^0^2^15^ ^403^^^ -60^Farbschema-Typ^schemetype^ ^ ^1^linear|sqrt|pow|log|symlog|sequential|cyclical|quantile^0^2^12^ ^304^^^ -61^Elementtyp^marks^ ^ ^1^Plot.line|Plot.dot|Plot.areaX|Plot.areaY.|Plot.barX|Plot.barY|Plot.rectX|Plot.rectY|Plot.ruleX|Plot.ruleY|Plot.tickX|Plot.tickY|Plot.arrow|Plot.cell|Plot.text|Plot.link|Plot.image^0^2^12^ ^301^^^ -63^Kat: Label-Abstand^labelOffset^ ^px^1^ ^0^1^18^ ^602^^^ -68^Maß: Chart-Abstand^gridChartOffset^3^ ^1^ ^0^1^18^ ^607^^^ -69^Maß: Label-Höhe^gridLabelHeight^18^px^1^ ^0^1^18^ ^608^^^ +1^Diagramm-Höhe^height^400^px^1^ ^0^4^10^(Wird nur ausgewertet wenn es keine Y-Achse gibt)^101^^^integer^ +2^Diagramm-Breite^width^500^px^1^ ^0^4^10^Äußere Breite des Diagramms inkl. Ränder^102^100^2000^integer^ +3^Werte-Label-Breite^valueLabelWidth^20^px^1^^0^1^18^^^^^integer^ +4^Hintergrundfarbe^backgroundColor^#ccffcc^ ^1^#ffffeb^0^3^11^ ^201^^^string^ +5^Vordergrundfarbe^color^black^ ^1^black^0^3^11^Text- und Diagrammelemente^202^^^string^ +6^Schriftgröße^fontSize^10^px^1^ ^0^4^11^Text- und Diagrammelemente^204^^^integer^ +7^Schriftfamilie^fontFamily^serif^ ^1^serif|sans-serif|monospace|system_ui^0^2^11^ ^203^^^string^ +8^Flächenfarbe^fill^blue^ ^1^ ^0^1^10^relevant für Flächen,Balken, Säulen, Streifen, Punkte^305^^^string^ +11^Kat: Schriftneigung^tickRotate^-45^ ^1^ ^0^1^18^ ^604^^^integer^ +12^Kat: Skalierung^ticks^5^ ^1^ ^0^1^18^ ^605^^^integer^ +13^Kat: Schriftgröße^tickSize^10^ ^1^ ^0^1^18^ ^603^^^integer^ +15^Kat: Label-Ausrichtung^labelAnchor^center^ ^1^left|center|right^0^2^18^ ^601^^^string^ +16^Außenrand links^marginLeft^ ^px^1^ ^0^4^10^ ^103^^^integer^ +17^Außenrand rechts^marginRight^50^px^1^ ^0^4^10^ ^104^^^integer^ +18^Außenrand oben^marginTop^50^px^1^ ^0^4^10^ ^105^^^integer^ +19^Außenrand unten^marginBottom^50^px^1^ ^0^4^10^ ^106^^^integer^ +20^Innenrand oben^insetTop^0^px^1^ ^0^4^10^ ^107^^^integer^ +21^Innenrand unten^insetBottom^0^px^1^ ^0^4^10^ ^108^^^integer^ +22^Innenrand links^insetLeft^0^px^1^ ^0^4^10^ ^109^^^integer^ +23^Innenrand rechts^insetRight^0^px^1^ ^0^4^10^ ^110^^^integer^ +24^Farbschema^scheme^ ^ ^1^blues|greens|greys|oranges|purples|reds^0^2^20^ ^303^^^string^ +25^Farbtyp^type^ ^ ^1^einfarbig|mehrfarbig|zyklisch^0^2^12^ ^302^^^string^ +43^Farbsättigung^fillOpacity^0,5^ ^1^ ^0^4^12^ ^306^^^string^ +44^Strichfarbe^stroke^ ^ ^1^ ^0^1^12^sfsfsdf^307^^^string^ +45^Strichdicke^strokeWidth^ ^ ^1^ ^0^1^12^^308^^^string^ +56^Fortlaufende Skala^continous scales^ ^ ^1^identity|linear|log|pow|sqrt|symlog^0^2^15^ ^401^^^string^ +57^Kategorie-Skala^categorical scales^ ^ ^1^point|band^0^2^15^ ^402^^^string^ +58^Datums-Skala^date scales^ ^ ^1^time|utc^0^2^15^ ^403^^^string^ +60^Farbschema-Typ^schemetype^ ^ ^1^linear|sqrt|pow|log|symlog|sequential|cyclical|quantile^0^2^12^ ^304^^^string^ +61^Elementtyp^marks^ ^ ^1^Plot.line|Plot.dot|Plot.areaX|Plot.areaY.|Plot.barX|Plot.barY|Plot.rectX|Plot.rectY|Plot.ruleX|Plot.ruleY|Plot.tickX|Plot.tickY|Plot.arrow|Plot.cell|Plot.text|Plot.link|Plot.image^0^2^12^ ^301^^^string^ +63^Kat: Label-Abstand^labelOffset^ ^px^1^ ^0^1^18^ ^602^^^integer^ +68^Maß: Chart-Abstand^gridChartOffset^3^ ^1^ ^0^1^18^ ^607^^^string^ +69^Maß: Label-Höhe^gridLabelHeight^18^px^1^ ^0^1^18^ ^608^^^integer^ +70^Kategorie-Dimension 1^viz_dimension1^ ^ ^1^ ^0^1^5^ ^608^^^string^ +71^Kategorie-Dimension 2^viz_dimension2^ ^ ^1^ ^0^1^5^ ^608^^^string^ +72^Maß^viz_measure1^ ^ ^1^ ^0^1^6^ ^608^^^string^ +73^Maß 2^viz_measure2^ ^ ^1^ ^0^1^6^ ^608^^^string^ +74^Maß^x_horizontal^ ^ ^1^ ^0^1^5^ ^608^^^string^ +75^Kategorie-Dimension^y_horizontal^ ^ ^1^ ^0^1^5^ ^608^^^string^ +76^Balkensegment^stroke_bar^ ^ ^1^ ^0^1^5^ ^608^^^string^ +78^Legende^legend^ ^ ^1^true|false^0^2^20^ ^303^^^boolean^ +79^Textbeschriftung^text_horizontal^ ^ ^1^ ^0^1^5^ ^608^^^string^ diff --git a/src-modules/module/viz/schluesseltabellen/viz_property_group.unl b/src-modules/module/viz/schluesseltabellen/viz_property_group.unl index 169c29a..73d9477 100644 --- a/src-modules/module/viz/schluesseltabellen/viz_property_group.unl +++ b/src-modules/module/viz/schluesseltabellen/viz_property_group.unl @@ -1,5 +1,5 @@ 5^CATEGORY^Kategorie-Achse^60^ -6^DIMENSION^Maß-Achse^70^ +6^MEASURE^Maß-Achse^70^ 10^LAYOUT^Layout^10^ 11^STYLE^Style^20^ 12^MARKS^Diagramm-Elemente^30^ @@ -7,3 +7,4 @@ 17^AXIS^Achsen-Customizing^50^ 18^TICKS_LABELS^Achsen-Beschriftung^^ 19^TICKFORMATTING^Zahlen-, Datumsformat^80^ +20^COLOR^Farben^90^ diff --git a/src-modules/module/viz/schluesseltabellen/viz_property_group_renderer.unl b/src-modules/module/viz/schluesseltabellen/viz_property_group_renderer.unl index a49dd19..6d0f36f 100644 --- a/src-modules/module/viz/schluesseltabellen/viz_property_group_renderer.unl +++ b/src-modules/module/viz/schluesseltabellen/viz_property_group_renderer.unl @@ -1,2 +1,4 @@ 1^2^11^style^ -2^2^10^ ^ +2^2^10^layout^ +3^2^18^x^ +4^2^20^color^ diff --git a/src-modules/module/viz/schluesseltabellen/viz_property_renderer.unl b/src-modules/module/viz/schluesseltabellen/viz_property_renderer.unl index c1ab7f8..2c13e13 100644 --- a/src-modules/module/viz/schluesseltabellen/viz_property_renderer.unl +++ b/src-modules/module/viz/schluesseltabellen/viz_property_renderer.unl @@ -6,3 +6,16 @@ 6^2^1^height^ 7^2^8^fill^ 8^2^16^marginLeft^ +9^2^11^tickRotate^ +10^2^74^x^ +11^2^75^y^ +12^2^76^stroke^ +14^2^24^scheme^ +15^2^78^legend^ +16^2^17^marginRight^ +17^2^18^marginTop^ +18^2^19^marginBottom^ +19^2^20^insetTop^ +20^2^21^insetBottom^ +21^2^22^insetLeft^ +22^2^23^insetRight^ diff --git a/src-modules/module/viz/schluesseltabellen/viz_type.unl b/src-modules/module/viz/schluesseltabellen/viz_type.unl index a78d2c1..b23a1b1 100644 --- a/src-modules/module/viz/schluesseltabellen/viz_type.unl +++ b/src-modules/module/viz/schluesseltabellen/viz_type.unl @@ -1,3 +1,6 @@ -1^bar_x^Balkendiagramm (horizontal)^ -2^bar_y^Balkendiagramm (vertikal)^ -3^line^Liniendiagramm (vertikal)^ +1^bar_x^Balkendiagramm (horizontal einfach)^2^/superx/xml/js/viz/viz_functions.js^makeBarX^ +2^bar_y^Balkendiagramm (vertikal)^2^/superx/xml/js/viz/viz_functions.js^makeBarY^ +3^line^Liniendiagramm (vertikal)^2^/superx/xml/js/viz/viz_functions.js^makeLine^ +4^bar_x_stacked^Balkendiagramm (horizontal gestapelt)^2^^^ +5^area_y^Flächendiagramm (vertikal)^2^^^ +6^dot^Punktediagramm (vertikal)^2^^^ diff --git a/src-modules/module/viz/schluesseltabellen/viz_type_property.unl b/src-modules/module/viz/schluesseltabellen/viz_type_property.unl new file mode 100644 index 0000000..81d9272 --- /dev/null +++ b/src-modules/module/viz/schluesseltabellen/viz_type_property.unl @@ -0,0 +1,14 @@ +1^1^70^1^ +3^1^72^1^ +4^4^74^1^ +5^4^75^1^ +6^4^76^1^ +8^2^70^1^ +9^2^72^1^ +10^3^70^1^ +12^5^70^1^ +13^3^72^1^ +15^5^72^1^ +16^6^70^1^ +17^6^72^1^ +18^4^79^0^ diff --git a/superx/xml/js/viz/viz_functions.js b/superx/xml/js/viz/viz_functions.js index b720431..2fac29a 100644 --- a/superx/xml/js/viz/viz_functions.js +++ b/superx/xml/js/viz/viz_functions.js @@ -142,31 +142,11 @@ function showChartPropertiesForm() function prepareChartProperties(chartType) { var chartProperties=[]; - //var chartWidth=getCommonChartProperty("chartWidth"); - //document.forms["chartPropertiesForm"].elements["chartWidth"].value=chartWidth; - switch (chartType) { - case "bar_x": - chartProperties=prepareForm("bar_x",vizTypeProperties); //prepareBarXForm(); - break; - case "bar_y": - chartProperties=prepareBarYForm(); - break; - case "area_y": - chartProperties=prepareBarYForm(); - case "dot": - chartProperties=prepareBarYForm(); - break; - case "line": - chartProperties=prepareLineForm(); - break; - default: - return false; - break; -} -renderForm("chartPropertiesForm",chartProperties,commonChartProperties); -renderFormDetails("chartPropertiesFormDetails",commonChartProperties); + chartProperties=prepareForm(chartType,vizTypeProperties); + renderForm("chartPropertiesForm",chartProperties,commonChartProperties); + renderFormDetails("chartPropertiesFormDetails",commonChartProperties); -return true; + return true; } @@ -307,7 +287,8 @@ function fillSelectionResultMetaData() if(dimension2!="") { counter++; - selectionRsMetaData.push(new selectionRowMetaData(counter,"dimension2",dimension2,getColumnCaption(dimension2),0),functionOfDimension2); + var dim2=new selectionRowMetaData(counter,"dimension2",dimension2,getColumnCaption(dimension2),0,functionOfDimension2); + selectionRsMetaData.push(dim2 ); } counter++; selectionRsMetaData.push(new selectionRowMetaData(counter,"measure",measure,getColumnCaption(measure),0),functionOfMeasureDim); @@ -520,7 +501,9 @@ var previousGroup=""; for(var k=0;k < myCommonChartProperties.length;k++) { var groupUniquename=myCommonChartProperties[k].groupUniquename; - if(groupUniquename!="" && groupUniquename != previousGroup) + if(groupUniquename!="" + && groupUniquename != previousGroup + && myCommonChartProperties[k].groupVariableName !="") { var newcommonChartPropertyGroup = new commonChartPropertyGroup(myCommonChartProperties[k].groupCaption,groupUniquename,""); commonChartPropertyGroups.push(newcommonChartPropertyGroup); @@ -657,7 +640,7 @@ function renderChartPropertyField(commonChartProperty) default: //Einfaches Texteingabefeld: const inpElem = document.createElement("input"); - inpElem.type="TEXT"; + inpElem.type=(commonChartProperty.propValueType=="integer")?"NUMBER":"TEXT"; inpElem.size=5; if(commonChartProperty.variableName=="") { @@ -882,6 +865,7 @@ var chartWidth=getCommonChartProperty("chartWidth"); var fontSize=getCommonChartProperty("fontSize"); //svg,data document.getElementById(chartDivElem).innerHTML=""; //reset canvas +/* var svg = d3.select("#"+chartDivElem).append("svg") .attr("width", chartWidth) //maxBarWidth + barLabelWidth + valueLabelWidth) //.attr("height", y.range()[1]) @@ -891,15 +875,18 @@ var svg = d3.select("#"+chartDivElem).append("svg") .attr("id", "chartSVG") ; svg.width=50; - +*/ switch (chartType) { -case "sample": - makeSample(); + case "sample": + makeSample(); + break; + case "bar_x": + makeBarX(chartDivElem,selectionRs); + break; + case "bar_x_stacked": + makeBarXStacked(chartDivElem,selectionRs); break; -case "bar_x": - makeBarX(chartDivElem,selectionRs); - break; case "bar_x_alt": makeBarX(svg,data); break; @@ -1028,11 +1015,12 @@ function makeSample() ).plot()); } -function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVertical) +function getChartOptions(categoryDim1,categoryDim2,measureDim,marksArray,chartOrientationVertical) { var options; - var categoryDim=document.getElementById("viz_dimension1").value; - var measureDim=document.getElementById("viz_measure1").value; + //var categoryDim1=document.getElementById("viz_dimension1").value; + //var categoryDim2=document.getElementById("viz_dimension2").value; + //var measureDim=document.getElementById("viz_measure1").value; var chartWidth=getCommonChartProperty("width"); var marginLeftValue=chartWidth/5; //Default 20% linker Rand //if(getCommonChartProperty("marginLeft")!="") @@ -1043,7 +1031,8 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti var myBgColor=getCommonChartProperty("background-color"); var myColor=getCommonChartProperty("color"); var marginBottomValue=100;//getCommonChartProperty("marginBottom");; - var categoryLabel=getColumnCaption(categoryDim); + var categoryLabel1=getColumnCaption(categoryDim1); + var categoryLabel2=getColumnCaption(categoryDim2); var measureLabel=getColumnCaption(measureDim); var optionsString="{\"dummy\":1"; @@ -1062,6 +1051,7 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti previousGroup=groupVariableName; } //Now create options Str with all groups: + var textDelim=""; for(var i=0;i < commonChartPropertyGroups.length;i++) { if(commonChartPropertyGroups[i].groupVariableName!="layout") @@ -1072,13 +1062,14 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti && commonChartProperties[k].variableName!="" && getCommonChartProperty(commonChartProperties[k].name)!="") { - optionsString+=",\""+commonChartProperties[k].variableName+"\":\""+getCommonChartProperty(commonChartProperties[k].name)+"\""; + textDelim=(commonChartProperties[k].propValueType=="string")?"\"":""; + optionsString+=",\""+commonChartProperties[k].variableName+"\":"+textDelim+getCommonChartProperty(commonChartProperties[k].name)+textDelim; } } if(commonChartPropertyGroups[i].groupVariableName!="layout") optionsString+=" }"; //close tag } - optionsString+= ",\"y\":{\"label\":\"Semester\"}"; + //optionsString+= ",\"y\":{\"label\":\"Semester\"}"; optionsString+= ", \"marks\":[]"; //optionsString+= ", \"marks\":"+JSON.stringify(marksArray)+""; optionsString+= ", \"caption\":\""+myCaption+"\""; @@ -1101,100 +1092,59 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti var styles=JSON.parse(stylesString); var chartOptions=JSON.parse(optionsString); chartOptions["marks"].push(marksArray); - /*var styles={ - backgroundColor: myBgColor, - color: myColor, - fontFamily: myFontFamily, - fontSize: fontSizeDefault, - overflow: "visible" - }*/ - - if(chartOrientationVertical) - { - options={ - marginLeft:marginLeftValue, - marginBottom:marginBottomValue, - width:chartWidth, - x: { - tickRotate: -45, - label:categoryLabel - }, - // set y axis options - y: { - grid:true, - label: measureLabel - }, - marks: marksArray, - style: styles, - caption: myCaption - } - } - else - { - options=chartOptions; - /* - options={ - marginLeft:marginLeftValue, - marginBottom:marginBottomValue, - width:chartWidth, - y: { - label:categoryLabel - }, - x: { - tickRotate: -45, - grid:true, - label: measureLabel - }, - marks: marksArray, - style: styles, - caption:myCaption - - } - */ - } - //document.getElementById("chartOptions").innerHTML=JSON.stringify(options); + options=chartOptions; return options; } function makeBarX(chartDivElem,selectionRs) { var categoryDim=document.getElementById("viz_dimension1").value; + //var categoryDim2=document.getElementById("viz_dimension2").value; var measureDim=document.getElementById("viz_measure1").value; - var fillDim=document.getElementById("fill").value; + var fillval=document.getElementById("fill").value; var marksArray=new Array(); - if(fillDim=="") marksArray[0]=Plot.barX(selectionRs, - Plot.sort("rownr", - { + { x: measureDim, y: categoryDim, - - fill: "blue" - }) + fill: fillval + } ); - else + + var options= getChartOptions(categoryDim,"",measureDim,marksArray,false); + console.log("Options:"+ JSON.stringify(options)); + var svgPlot=Plot.plot(options); + document.getElementById(chartDivElem).appendChild(svgPlot); + } + +function makeBarXStacked(chartDivElem,selectionRs) { + var categoryDim1=document.getElementById("y_horizontal").value; + var categoryDim2=document.getElementById("stroke_bar").value; + var measureDim=document.getElementById("x_horizontal").value; + var textDim=document.getElementById("text_horizontal").value; + //var fillDim=document.getElementById("fill").value; + var marksArray=new Array(); marksArray[0]=Plot.barX(selectionRs, { x: measureDim, - y: categoryDim, - //sort: {y: "rownr"}, - fill: fillDim + y: categoryDim1, + stroke: categoryDim2, + fill: categoryDim2 }) ; - - var options= getChartOptions(categoryDim,measureDim,marksArray,false); -/* var svgPlot=Plot.plot({ - y: { - domain: d3.sort(selectionRs, d => -d.rownr).map(d => d.dimension1Value) - }, - x: { - grid: true - }, - marks: [ - Plot.barX(selectionRs, {x: measureDim, y: categoryDim}) - ] -});*/ -console.log("Options:"+ JSON.stringify(options)); -var svgPlot=Plot.plot(options); + marksArray[1]=Plot.ruleX([0]); + if(textDim !="") + marksArray[2]=Plot.text(selectionRs, + { + x: measureDim, + y: categoryDim1, + text: textDim + }) + ; + + var options= getChartOptions(categoryDim1,categoryDim2,measureDim,marksArray,false); + + console.log("Options:"+ JSON.stringify(options)); + var svgPlot=Plot.plot(options); document.getElementById(chartDivElem).appendChild(svgPlot); } function makeBarY(chartDivElem,selectionRs) { @@ -1206,8 +1156,9 @@ function makeBarY(chartDivElem,selectionRs) { y: measureDim, x: categoryDim }); + marksArray[1]=Plot.ruleY([0]); - var options= getChartOptions(categoryDim,measureDim,marksArray,true); + var options= getChartOptions(categoryDim,"",measureDim,marksArray,true); document.getElementById(chartDivElem).appendChild(Plot.plot(options)); } @@ -1220,8 +1171,9 @@ function makeAreaY(chartDivElem,selectionRs) { y: measureDim, x: categoryDim }); + marksArray[1]=Plot.ruleY([0]); - var options= getChartOptions(categoryDim,measureDim,marksArray,true); + var options= getChartOptions(categoryDim,"",measureDim,marksArray,true); document.getElementById(chartDivElem).appendChild(Plot.plot(options)); } @@ -1234,8 +1186,10 @@ function makeDot(chartDivElem,selectionRs) { y: measureDim, x: categoryDim }); + marksArray[1]=Plot.ruleY([0]); + marksArray[2]=Plot.ruleX([0]); - var options= getChartOptions(categoryDim,measureDim,marksArray,true); + var options= getChartOptions(categoryDim,"",measureDim,marksArray,true); document.getElementById(chartDivElem).appendChild(Plot.plot(options)); } @@ -1256,7 +1210,7 @@ function makeLine(chartDivElem,selectionRs) { }); marksArray[2]=Plot.ruleY([0]); - var options= getChartOptions(categoryDim,measureDim,marksArray,true); + var options= getChartOptions(categoryDim,"",measureDim,marksArray,true); document.getElementById(chartDivElem).appendChild(Plot.plot(options)); } diff --git a/superx/xml/viz_html_chart.xsl b/superx/xml/viz_html_chart.xsl index 7dcb88c..ad560d3 100644 --- a/superx/xml/viz_html_chart.xsl +++ b/superx/xml/viz_html_chart.xsl @@ -143,7 +143,8 @@ groupCaption, groupUniquename, rendererUniquename, groupVariableName, -variableName +variableName, +propValueType ) { this.name=name; @@ -160,6 +161,7 @@ this.groupUniquename=groupUniquename; this.rendererUniquename=rendererUniquename; this.groupVariableName=groupVariableName; this.variableName=variableName; +this.propValueType=propValueType; this.getValueResultset = function () { var valueOptions=[]; var optionCounter=0; @@ -224,6 +226,8 @@ var newCommonChartProperty = new commonChartProperty(" "," +"," + "); commonChartProperties.push(newCommonChartProperty); @@ -243,7 +247,8 @@ false, "", "plot", "layout", -"caption"); +"caption", +"string"); commonChartProperties.push(newCommonChartProperty);