Browse Source

Plot neue Version 0.6.1, neue Tabelle viz_property_renderer #5

makro_datasrc
Daniel Quathamer 2 years ago
parent
commit
6e569ee0a1
  1. 8
      .classpath
  2. 1
      .gitignore
  3. 31
      .project
  4. 1
      src-modules/module/viz/conf/includes.txt
  5. 11
      src-modules/module/viz/conf/viz.xml
  6. 63
      src-modules/module/viz/schluesseltabellen/viz_property.unl
  7. 15
      src-modules/module/viz/schluesseltabellen/viz_property_group.unl
  8. 2
      src-modules/module/viz/schluesseltabellen/viz_property_renderer.unl
  9. 3
      src-modules/module/viz/schluesseltabellen/viz_property_unload.x
  10. 3
      superx/META-INF/MANIFEST.MF
  11. 0
      superx/xml/js/viz/d3-7.8.0-license.txt
  12. 4
      superx/xml/js/viz/d3.min.js
  13. 0
      superx/xml/js/viz/plot-0.6.1-license.txt
  14. 4
      superx/xml/js/viz/plot.js
  15. 118
      superx/xml/js/viz/viz_functions.js
  16. 50
      superx/xml/viz_html_chart.xsl

8
.classpath

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<classpath>
<classpathentry kind="con" path="org.eclipse.jdt.launching.JRE_CONTAINER/org.eclipse.jdt.internal.debug.ui.launcher.StandardVMType/JavaSE-1.8"/>
<classpathentry kind="src" path="src/main/java"/>
<classpathentry kind="con" path="org.eclipse.jst.j2ee.internal.web.container"/>
<classpathentry kind="con" path="org.eclipse.jst.j2ee.internal.module.container"/>
<classpathentry kind="output" path="build/classes"/>
</classpath>

1
.gitignore vendored

@ -0,0 +1 @@
/build/

31
.project

@ -0,0 +1,31 @@
<?xml version="1.0" encoding="UTF-8"?>
<projectDescription>
<name>viz</name>
<comment></comment>
<projects>
</projects>
<buildSpec>
<buildCommand>
<name>org.eclipse.jdt.core.javabuilder</name>
<arguments>
</arguments>
</buildCommand>
<buildCommand>
<name>org.eclipse.wst.common.project.facet.core.builder</name>
<arguments>
</arguments>
</buildCommand>
<buildCommand>
<name>org.eclipse.wst.validation.validationbuilder</name>
<arguments>
</arguments>
</buildCommand>
</buildSpec>
<natures>
<nature>org.eclipse.jem.workbench.JavaEMFNature</nature>
<nature>org.eclipse.wst.common.modulecore.ModuleCoreNature</nature>
<nature>org.eclipse.wst.common.project.facet.core.nature</nature>
<nature>org.eclipse.jdt.core.javanature</nature>
<nature>org.eclipse.wst.jsdt.core.jsNature</nature>
</natures>
</projectDescription>

1
src-modules/module/viz/conf/includes.txt

@ -1,6 +1,7 @@
doku/viz_modul/viz.html doku/viz_modul/viz.html
images/icons/more.svg images/icons/more.svg
images/icons/chart-bar.svg images/icons/chart-bar.svg
images/information_grey_liberation.svg
style/sx_viz_muster.css style/sx_viz_muster.css
WEB-INF/conf/edustore/db/bin/SQL_ENV_viz.sam WEB-INF/conf/edustore/db/bin/SQL_ENV_viz.sam
xml/js/viz/viz_functions.js xml/js/viz/viz_functions.js

11
src-modules/module/viz/conf/viz.xml

@ -16,6 +16,9 @@ rightname="CS_BIA_STANDARDREPORTS_ADMIN[VIZ]" />
<column name="tid" type="SERIAL" size="" default="" notnull="true" description="tid" isKey="true"/> <column name="tid" type="SERIAL" size="" default="" notnull="true" description="tid" isKey="true"/>
<column name="uniquename" type="VARCHAR" size="255" default="" notnull="true" description="Unique Name" /> <column name="uniquename" type="VARCHAR" size="255" default="" notnull="true" description="Unique Name" />
<column name="caption" type="VARCHAR" size="255" default="" notnull="" description="Bezeichnung" /> <column name="caption" type="VARCHAR" size="255" default="" notnull="" description="Bezeichnung" />
<column name="renderer_id" type="INTEGER" size="4" default="" notnull="false" description="Renderer" isKey="false"/>
<column name="srcpath" type="VARCHAR" size="255" default="" notnull="false" description="Pfad zum Quellcode" isKey="false"/>
<column name="method" type="VARCHAR" size="255" default="" notnull="false" description="Methode" isKey="false"/>
</columns> </columns>
<primaryKeys><rs> <primaryKeys><rs>
@ -197,6 +200,8 @@ rightname="CS_BIA_STANDARDREPORTS_ADMIN[VIZ]" />
<column name="tid" type="SERIAL" size="" default="" notnull="true" description="tid" isKey="true"/> <column name="tid" type="SERIAL" size="" default="" notnull="true" description="tid" isKey="true"/>
<column name="viz_type_id" type="INTEGER" size="" default="" notnull="false" description="Art der Visualisierung" /> <column name="viz_type_id" type="INTEGER" size="" default="" notnull="false" description="Art der Visualisierung" />
<column name="viz_property_id" type="INTEGER" size="255" default="" notnull="" description="Eigenschaft der Visualisierung" /> <column name="viz_property_id" type="INTEGER" size="255" default="" notnull="" description="Eigenschaft der Visualisierung" />
<column name="viz_property_id" type="INTEGER" size="255" default="" notnull="" description="Eigenschaft der Visualisierung" />
<column name="is_mandatory" type="SMALLINT" size="255" default="0" notnull="false" description="Pflichteingabe" ><comment>1=ja, 0=nein</comment></column>
</columns> </columns>
<primaryKeys><rs> <primaryKeys><rs>
@ -334,7 +339,11 @@ parent="Masken verwalten">Abfragen zur Administration von Visualisierungen </the
displayType="select" visibleFields="caption" format="%s"> displayType="select" visibleFields="caption" format="%s">
<relation-column from="tid" to="renderer_id" /> <relation-column from="tid" to="renderer_id" />
</relation> </relation>
<!-- viz_type -->
<relation from="viz_renderer" to="viz_type" delete="FALSE"
displayType="select" visibleFields="caption" format="%s">
<relation-column from="tid" to="renderer_id" />
</relation>
</data-integrity> </data-integrity>
</database> </database>

63
src-modules/module/viz/schluesseltabellen/viz_property.unl

@ -1,30 +1,33 @@
1^Diagramm-Höhe^height^500^px^1^^0^1^10^(Wird nur ausgewertet wenn es keine Y-Achse gibt)^^^^ 1^Diagramm-Höhe^height^400^px^1^ ^0^4^10^(Wird nur ausgewertet wenn es keine Y-Achse gibt)^101^^^
2^Diagramm-Breite^chartWidth^600^px^1^^0^1^10^Äußere Breite des Diagramms inkl. Ränder^^100^2000^ 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^10^^^^^ 3^Werte-Label-Breite^valueLabelWidth^20^px^1^^0^1^18^^^^^
4^Hintergrundfarbe^backgroundColor^#ffffeb^ ^1^ ^0^1^11^^^^^ 4^Hintergrundfarbe^backgroundColor^#ccffcc^ ^1^#ffffeb^0^3^11^ ^201^^^
5^Vordergrundfarbe^color^#3333ff^ ^1^ ^0^1^11^Text- und Diagrammelemente^^^^ 5^Vordergrundfarbe^color^black^ ^1^black^0^3^11^Text- und Diagrammelemente^202^^^
6^Schriftgröße^fontSize^10^pt^1^^0^1^11^Text- und Diagrammelemente^^^^ 6^Schriftgröße^fontSize^10^px^1^ ^0^4^11^Text- und Diagrammelemente^204^^^
7^Schriftfamilie^fontFamily^sans-serif^ ^1^sans-serif|serif|monospace^0^2^11^^^^^ 7^Schriftfamilie^fontFamily^serif^ ^1^serif|sans-serif|monospace|system_ui^0^2^11^ ^203^^^
8^Flächenfarbe^fill^blue^ ^1^ ^0^1^12^^^^^ 8^Flächenfarbe^fill^blue^ ^1^blue|red|brand^0^2^12^relevant für Flächen,Balken, Säulen, Streifen, Punkte^305^^^
9^Grid-Label-Höhe^gridLabelHeight^18^ ^1^ ^0^1^10^^^^^ 11^Kat: Schriftneigung^tickRotate^-45^ ^1^ ^0^1^18^ ^604^^^
10^Grid-Offset^gridChartOffset^3^ ^1^ ^0^1^10^^^^^ 12^Kat: Skalierung^ticks^5^ ^1^ ^0^1^18^ ^605^^^
11^tickRotate^tickRotate^-45^ ^0^ ^0^1^5^^^^^ 13^Kat: Schriftgröße^tickSize^10^ ^1^ ^0^1^18^ ^603^^^
12^ticks^Einheit X-Achse^5^ ^0^ ^0^1^5^^^^^ 15^Kat: Label-Ausrichtung^labelAnchor^center^ ^1^left|center|right^0^2^18^ ^601^^^
13^tickSize^Abstand X-Achse und Beschriftung^10^ ^0^ ^0^1^5^^^^^ 16^Außenrand links^marginLeft^50^px^1^ ^0^4^10^ ^103^^^
14^labelOffset^Abstand X-Achse Beschriftung^10^ ^0^ ^0^1^5^^^^^ 17^Außenrand rechts^marginRight^50^px^1^ ^0^4^10^ ^104^^^
15^Ausrichtung X-Achse Beschriftung^labelAnchor^center^ ^0^left|center|right^0^2^5^^^^^ 18^Außenrand oben^marginTop^50^px^1^ ^0^4^10^ ^105^^^
16^Außenrand links^^^^1^^0^1^10^^^^^ 19^Außenrand unten^marginBottom^50^px^1^ ^0^4^10^ ^106^^^
17^Außenrand rechts^^^^1^^0^1^10^^^^^ 20^Innenrand oben^insetTop^0^px^1^ ^0^4^10^ ^107^^^
18^Außenrand oben^^^^1^^0^1^10^^^^^ 21^Innenrand unten^insetBottom^0^px^1^ ^0^4^10^ ^108^^^
19^Außenrand unten^^^^1^^0^1^10^^^^^ 22^Innenrand links^insetLeft^0^px^1^ ^0^4^10^ ^109^^^
20^Innenrand oben^^^^1^^0^1^10^^^^^ 23^Innenrand rechts^insetRight^0^px^1^ ^0^4^10^ ^110^^^
21^Innenrand unten^^^^1^^0^1^10^^^^^ 24^Farbschema^scheme^ ^ ^1^blues|greens|greys|oranges|purples|reds^0^2^12^ ^303^^^
22^Innenrand links^^^^1^^0^1^10^^^^^ 25^Farbtyp^type^ ^ ^1^einfarbig|mehrfarbig|zyklisch^0^2^12^ ^302^^^
23^Innenrand rechts^^^^1^^0^1^10^^^^^ 43^Farbsättigung^fillOpacity^0,5^ ^1^ ^0^4^12^ ^306^^^
24^Farbschema^scale.scheme^ ^ ^1^blues|greens^0^2^12^^^^^ 44^Strichfarbe^stroke^ ^ ^1^ ^0^1^12^sfsfsdf^307^^^
25^Farbtyp^^^^1^^0^1^12^^^^^ 45^Strichdicke^strokeWidth^ ^ ^1^ ^0^1^12^^308^^^
43^Farbsättigung^^^^1^^0^1^12^^^^^ 56^Fortlaufende Skala^continous scales^ ^ ^1^identity|linear|log|pow|sqrt|symlog^0^2^15^ ^401^^^
44^Strichfarbe^stroke^ ^ ^1^ ^0^1^12^^^^^ 57^Kategorie-Skala^categorical scales^ ^ ^1^point|band^0^2^15^ ^402^^^
45^Strichdicke^strokeWidth^ ^ ^1^ ^0^1^12^^^^^ 58^Datums-Skala^date scales^ ^ ^1^time|utc^0^2^15^ ^403^^^
47^Werte X-Achse^Plot.groupX^ ^ ^1^Anzahl|Summe|Proportion|Minimum|Maximum|Durchschnitt|Varianz|Erster|Letzter^0^2^14^^^^^ 60^Farbschema-Typ^schemetype^ ^ ^1^linear|sqrt|pow|log|symlog|sequential|cyclical|quantile^0^2^12^ ^304^^^
55^Werte Y-Achse^Plot.groupY^ ^ ^1^Anzahl|Summe|Proportion|Minimum|Maximum|Durchschnitt|Varianz|Erster|Letzter^0^2^14^^^^^ 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^^^

15
src-modules/module/viz/schluesseltabellen/viz_property_group.unl

@ -1,6 +1,9 @@
5^X^X-Achse^50^ 5^CATEGORY^Kategorie-Achse^60^
6^Y^Y-Achse^40^ 6^DIMENSION^Maß-Achse^70^
10^LAYOUT^Diagramm-Layout^10^ 10^LAYOUT^Layout^10^
11^STYLE^Diagramm-Style^20^ 11^STYLE^Style^20^
12^ELEMENTS^Diagramm-Elemente^30^ 12^MARKS^Diagramm-Elemente^30^
14^DATACATEGORY^Wertekategorien^60^ 15^SCALES^Skalen-Typen^40^
17^AXIS^Achsen-Customizing^50^
18^TICKS_LABELS^Achsen-Beschriftung^^
19^TICKFORMATTING^Zahlen-, Datumsformat^80^

2
src-modules/module/viz/schluesseltabellen/viz_property_renderer.unl

@ -4,3 +4,5 @@
4^2^7^fontFamily^ 4^2^7^fontFamily^
5^2^6^fontSize^ 5^2^6^fontSize^
6^2^1^height^ 6^2^1^height^
7^2^8^fill^
8^2^16^marginLeft^

3
src-modules/module/viz/schluesseltabellen/viz_property_unload.x

@ -4,3 +4,6 @@ DOQUERY "select * from viz_property_group order by 1,2" false ^ viz_property_gro
DOQUERY "select * from viz_renderer order by 1,2" false ^ viz_renderer.unl DOQUERY "select * from viz_renderer order by 1,2" false ^ viz_renderer.unl
DOQUERY "select * from viz_property_renderer order by 1,2" false ^ viz_property_renderer.unl DOQUERY "select * from viz_property_renderer order by 1,2" false ^ viz_property_renderer.unl
DOQUERY "select * from viz_property_group_renderer order by 1,2" false ^ viz_property_group_renderer.unl DOQUERY "select * from viz_property_group_renderer order by 1,2" false ^ viz_property_group_renderer.unl
DOQUERY "select * from viz_type order by 1,2" false ^ viz_type.unl
DOQUERY "select * from viz_type_property order by 1,2" false ^ viz_type_property.unl

3
superx/META-INF/MANIFEST.MF

@ -0,0 +1,3 @@
Manifest-Version: 1.0
Class-Path:

0
superx/xml/js/viz/d3-7.0.0-license.txt → superx/xml/js/viz/d3-7.8.0-license.txt

4
superx/xml/js/viz/d3.min.js vendored

File diff suppressed because one or more lines are too long

0
superx/xml/js/viz/plot-0.4.3-license.txt → superx/xml/js/viz/plot-0.6.1-license.txt

4
superx/xml/js/viz/plot.js

File diff suppressed because one or more lines are too long

118
superx/xml/js/viz/viz_functions.js

@ -114,6 +114,7 @@ this.getValueResultset = function () {
} }
} }
function prepareSelectionForm() function prepareSelectionForm()
{ {
var selectionProperties=[]; var selectionProperties=[];
@ -145,13 +146,15 @@ function prepareChartProperties(chartType)
//document.forms["chartPropertiesForm"].elements["chartWidth"].value=chartWidth; //document.forms["chartPropertiesForm"].elements["chartWidth"].value=chartWidth;
switch (chartType) { switch (chartType) {
case "bar_x": case "bar_x":
chartProperties=prepareBarXForm(); chartProperties=prepareForm("bar_x",vizTypeProperties); //prepareBarXForm();
break; break;
case "bar_y": case "bar_y":
chartProperties=prepareBarYForm(); chartProperties=prepareBarYForm();
break; break;
case "area_y": case "area_y":
chartProperties=prepareBarYForm(); chartProperties=prepareBarYForm();
case "dot":
chartProperties=prepareBarYForm();
break; break;
case "line": case "line":
chartProperties=prepareLineForm(); chartProperties=prepareLineForm();
@ -167,6 +170,22 @@ return true;
} }
function prepareForm(vizTypeUniquename,vizTypeProperties)
{
var chartProperties=[];
var propertyCounter=0;
for(var k=0;k < vizTypeProperties.length;k++)
{
if(vizTypeUniquename==vizTypeProperties[k].typeUniquename)
{
var isMeasure=(vizTypeProperties[k].groupUniquename=="MEASURE")?true:false;
var myProp= new dimensionProperty(vizTypeProperties[k].propUniquename,vizTypeProperties[k].caption,isMeasure,vizTypeProperties[k].isMandatory);
chartProperties.push(myProp);
propertyCounter++;
}
}
return chartProperties;
}
function prepareBarXForm() function prepareBarXForm()
{ {
@ -397,7 +416,7 @@ function renderForm(formDiv,myChartProperties,myCommonChartProperties)
columnDivBoxTitle.style="width: 500px"; columnDivBoxTitle.style="width: 500px";
for(var k=0;k < myCommonChartProperties.length;k++) for(var k=0;k < myCommonChartProperties.length;k++)
{ {
if(myCommonChartProperties[k].name=="chartCaption") if(myCommonChartProperties[k].name=="caption")
columnDivBoxTitle.appendChild(renderChartPropertyField(myCommonChartProperties[k])); columnDivBoxTitle.appendChild(renderChartPropertyField(myCommonChartProperties[k]));
} }
@ -503,7 +522,7 @@ for(var k=0;k < myCommonChartProperties.length;k++)
var groupUniquename=myCommonChartProperties[k].groupUniquename; var groupUniquename=myCommonChartProperties[k].groupUniquename;
if(groupUniquename!="" && groupUniquename != previousGroup) if(groupUniquename!="" && groupUniquename != previousGroup)
{ {
var newcommonChartPropertyGroup = new commonChartPropertyGroup(myCommonChartProperties[k].groupCaption,groupUniquename); var newcommonChartPropertyGroup = new commonChartPropertyGroup(myCommonChartProperties[k].groupCaption,groupUniquename,"");
commonChartPropertyGroups.push(newcommonChartPropertyGroup); commonChartPropertyGroups.push(newcommonChartPropertyGroup);
} }
previousGroup=groupUniquename; previousGroup=groupUniquename;
@ -890,6 +909,9 @@ case "bar_x":
case "area_y": case "area_y":
makeAreaY(chartDivElem,selectionRs); makeAreaY(chartDivElem,selectionRs);
break; break;
case "dot":
makeDot(chartDivElem,selectionRs);
break;
case "line": case "line":
makeLine(chartDivElem,selectionRs); makeLine(chartDivElem,selectionRs);
break; break;
@ -1009,33 +1031,76 @@ function makeSample()
function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVertical) function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVertical)
{ {
var options; var options;
var categoryDim=document.getElementById("dimension1").value; var categoryDim=document.getElementById("viz_dimension1").value;
var measureDim=document.getElementById("measure1").value; var measureDim=document.getElementById("viz_measure1").value;
var fontSizeDefault=getCommonChartProperty("fontSize")+"pt";
var myCaption=getCommonChartProperty("chartCaption");
var chartWidth=getCommonChartProperty("width"); var chartWidth=getCommonChartProperty("width");
var marginLeftValue=chartWidth/5; //Default 20% linker Rand
//if(getCommonChartProperty("marginLeft")!="")
// marginLeftValue=getCommonChartProperty("marginLeft");
var fontSizeDefault=getCommonChartProperty("fontSize")+"pt";
var myCaption=getCommonChartProperty("caption");
var myFontFamily=getCommonChartProperty("font-family"); var myFontFamily=getCommonChartProperty("font-family");
var myBgColor=getCommonChartProperty("background-color"); var myBgColor=getCommonChartProperty("background-color");
var myColor=getCommonChartProperty("color"); var myColor=getCommonChartProperty("color");
var marginLeftDefault=chartWidth/5; //20% linker Rand var marginBottomValue=100;//getCommonChartProperty("marginBottom");;
var marginBottomDefault=100;
var categoryLabel=getColumnCaption(categoryDim); var categoryLabel=getColumnCaption(categoryDim);
var measureLabel=getColumnCaption(measureDim); var measureLabel=getColumnCaption(measureDim);
var optionsString="{\"dummy\":1";
//first Collect all groups:
var commonChartPropertyGroups=[];
var previousGroup="";
for(var k=0;k < commonChartProperties.length;k++)
{
var groupVariableName=commonChartProperties[k].groupVariableName;
if(groupVariableName!=""
&& groupVariableName != previousGroup)
{
var newcommonChartPropertyGroup = new commonChartPropertyGroup(commonChartProperties[k].groupCaption,commonChartProperties[k].groupUniquename,groupVariableName);
commonChartPropertyGroups.push(newcommonChartPropertyGroup);
}
previousGroup=groupVariableName;
}
//Now create options Str with all groups:
for(var i=0;i < commonChartPropertyGroups.length;i++)
{
if(commonChartPropertyGroups[i].groupVariableName!="layout")
optionsString+=",\""+commonChartPropertyGroups[i].groupVariableName+"\":{\"dummy1\":1";
for(var k=0;k < commonChartProperties.length;k++)
{
if(commonChartProperties[k].groupVariableName==commonChartPropertyGroups[i].groupVariableName
&& commonChartProperties[k].variableName!=""
&& getCommonChartProperty(commonChartProperties[k].name)!="")
{
optionsString+=",\""+commonChartProperties[k].variableName+"\":\""+getCommonChartProperty(commonChartProperties[k].name)+"\"";
}
}
if(commonChartPropertyGroups[i].groupVariableName!="layout")
optionsString+=" }"; //close tag
}
optionsString+= ",\"y\":{\"label\":\"Semester\"}";
optionsString+= ", \"marks\":[]";
//optionsString+= ", \"marks\":"+JSON.stringify(marksArray)+"";
optionsString+= ", \"caption\":\""+myCaption+"\"";
optionsString+=" }"; //close options tag
console.log("options:"+ optionsString);
var stylesString="{\"overflow\": \"visible\""; var stylesString="{\"overflow\": \"visible\"";
for(var k=0;k < commonChartProperties.length;k++) for(var k=0;k < commonChartProperties.length;k++)
{ {
if(commonChartProperties[k].variableName!="" && (commonChartProperties[k].groupUniquename=="STYLE" if(commonChartProperties[k].groupUniquename=="STYLE" )
|| commonChartProperties[k].groupUniquename=="LAYOUT"))
{ {
stylesString+=",\""+commonChartProperties[k].variableName+"\":\""+getCommonChartProperty(commonChartProperties[k].name)+"\""; stylesString+=",\""+commonChartProperties[k].variableName+"\":\""+getCommonChartProperty(commonChartProperties[k].name)+"\"";
} }
} }
stylesString+=" }"; stylesString+=" }";
console.log("Styles:"+ stylesString); console.log("Styles:"+ stylesString);
var styles=JSON.parse(stylesString); var styles=JSON.parse(stylesString);
var chartOptions=JSON.parse(optionsString);
chartOptions["marks"].push(marksArray);
/*var styles={ /*var styles={
backgroundColor: myBgColor, backgroundColor: myBgColor,
color: myColor, color: myColor,
@ -1047,8 +1112,8 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
if(chartOrientationVertical) if(chartOrientationVertical)
{ {
options={ options={
marginLeft:marginLeftDefault, marginLeft:marginLeftValue,
marginBottom:marginBottomDefault, marginBottom:marginBottomValue,
width:chartWidth, width:chartWidth,
x: { x: {
tickRotate: -45, tickRotate: -45,
@ -1066,9 +1131,11 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
} }
else else
{ {
options=chartOptions;
/*
options={ options={
marginLeft:marginLeftDefault, marginLeft:marginLeftValue,
marginBottom:marginBottomDefault, marginBottom:marginBottomValue,
width:chartWidth, width:chartWidth,
y: { y: {
label:categoryLabel label:categoryLabel
@ -1083,7 +1150,7 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
caption:myCaption caption:myCaption
} }
*/
} }
//document.getElementById("chartOptions").innerHTML=JSON.stringify(options); //document.getElementById("chartOptions").innerHTML=JSON.stringify(options);
@ -1126,6 +1193,7 @@ function makeBarX(chartDivElem,selectionRs) {
Plot.barX(selectionRs, {x: measureDim, y: categoryDim}) Plot.barX(selectionRs, {x: measureDim, y: categoryDim})
] ]
});*/ });*/
console.log("Options:"+ JSON.stringify(options));
var svgPlot=Plot.plot(options); var svgPlot=Plot.plot(options);
document.getElementById(chartDivElem).appendChild(svgPlot); document.getElementById(chartDivElem).appendChild(svgPlot);
} }
@ -1155,6 +1223,20 @@ function makeAreaY(chartDivElem,selectionRs) {
var options= getChartOptions(categoryDim,measureDim,marksArray,true); var options= getChartOptions(categoryDim,measureDim,marksArray,true);
document.getElementById(chartDivElem).appendChild(Plot.plot(options));
}
function makeDot(chartDivElem,selectionRs) {
var categoryDim=document.getElementById("viz_dimension1").value;
var measureDim=document.getElementById("viz_measure1").value;
var marksArray=new Array();
marksArray[0]=Plot.dot(selectionRs,
{
y: measureDim,
x: categoryDim
});
var options= getChartOptions(categoryDim,measureDim,marksArray,true);
document.getElementById(chartDivElem).appendChild(Plot.plot(options)); document.getElementById(chartDivElem).appendChild(Plot.plot(options));
} }
function makeLine(chartDivElem,selectionRs) { function makeLine(chartDivElem,selectionRs) {
@ -1221,7 +1303,7 @@ function getCommonChartProperty(name)
var propertyValue=""; var propertyValue="";
for (var i=0;i<commonChartProperties.length;i++) for (var i=0;i<commonChartProperties.length;i++)
{ {
if(commonChartProperties[i].name==name ) if(commonChartProperties[i].name==name && document.forms["chartPropertiesForm"].elements[name])
{ {
propertyValue=document.forms["chartPropertiesForm"].elements[name].value; propertyValue=document.forms["chartPropertiesForm"].elements[name].value;
if(propertyValue=="" && commonChartProperties[i].defaultValue!="") if(propertyValue=="" && commonChartProperties[i].defaultValue!="")

50
superx/xml/viz_html_chart.xsl

@ -122,6 +122,10 @@ padding-bottom:10px;
<xsl:template name="tableJavascript_viz"> <xsl:template name="tableJavascript_viz">
<script language="Javascript" type="text/javascript" src="/superx/xml/js/viz/d3.min.js" /> <script language="Javascript" type="text/javascript" src="/superx/xml/js/viz/d3.min.js" />
<script language="Javascript" type="text/javascript" src="/superx/xml/js/viz/plot.js" /> <script language="Javascript" type="text/javascript" src="/superx/xml/js/viz/plot.js" />
<xsl:for-each select="/ergebnisse/ergebnis/ergebniselement/vizTypes/vizType[@srcpath !='/superx/xml/js/viz/d3.min.js' and @srcpath != '/superx/xml/js/viz/plot.js']">
<script language="Javascript" type="text/javascript" src="{@srcpath}" />
</xsl:for-each>
<script><xsl:text><![CDATA[ <script><xsl:text><![CDATA[
//document.body.append(Plot.plot(options)); //document.body.append(Plot.plot(options));
@ -175,12 +179,15 @@ var staticValueArray = staticValues.split(/\|/);
return valueOptions; return valueOptions;
} }
} }
function commonChartPropertyGroup(caption,groupUniquename) function commonChartPropertyGroup(caption,groupUniquename,groupVariableName)
{ {
this.caption=caption; this.caption=caption;
this.groupUniquename=groupUniquename; this.groupUniquename=groupUniquename;
this.groupVariableName=groupVariableName;
} }
var commonChartProperties=[]; var commonChartProperties=[];
]]></xsl:text> ]]></xsl:text>
<xsl:for-each select="/ergebnisse/ergebnis/ergebniselement/chartProperties/commonChartProperty"> <xsl:for-each select="/ergebnisse/ergebnis/ergebniselement/chartProperties/commonChartProperty">
@ -222,7 +229,7 @@ commonChartProperties.push(newCommonChartProperty);
</xsl:text> </xsl:text>
</xsl:for-each> </xsl:for-each>
<xsl:text> <xsl:text>
var newCommonChartProperty = new commonChartProperty("chartCaption", var newCommonChartProperty = new commonChartProperty("caption",
"Titel des Diagramms", "Titel des Diagramms",
false, false,
"TEXTAREA", "TEXTAREA",
@ -235,11 +242,39 @@ false,
"Diagrammkopf", "Diagrammkopf",
"", "",
"plot", "plot",
"", "layout",
""); "caption");
commonChartProperties.push(newCommonChartProperty); commonChartProperties.push(newCommonChartProperty);
</xsl:text> </xsl:text>
<xsl:text>
function vizTypeProperty(propUniquename,caption,typeUniquename,groupUniquename,isMandatory)
{
this.propUniquename=propUniquename;
this.caption=caption;
this.groupUniquename=groupUniquename;
this.typeUniquename=typeUniquename;
this.isMandatory=isMandatory;
}
var vizTypeProperties=[];
</xsl:text>
<xsl:for-each select="/ergebnisse/ergebnis/ergebniselement/viz_type_properties/viz_type_property">
<xsl:text>
var newVizTypeProperty = new vizTypeProperty("</xsl:text>
<xsl:value-of select="@uniquename" />
<xsl:text>","</xsl:text>
<xsl:value-of select="@caption" />
<xsl:text>","</xsl:text>
<xsl:value-of select="@viz_type_uniquename" />
<xsl:text>","</xsl:text>
<xsl:value-of select="@viz_property_group_uniquename" />
<xsl:text>",</xsl:text>
<xsl:value-of select="@is_mandatory" /><xsl:text>
);
vizTypeProperties.push(newVizTypeProperty);
</xsl:text>
</xsl:for-each>
</script> </script>
<script language="Javascript" type="text/javascript" src="../xml/js/viz/viz_functions.js" /> <script language="Javascript" type="text/javascript" src="../xml/js/viz/viz_functions.js" />
@ -1695,10 +1730,9 @@ rs.push(new dataRow(</xsl:text><xsl:value-of select="$rownr"/>
<div class="select is-small is-fullwidth"> <div class="select is-small is-fullwidth">
<select class="maskinputPflicht" id="viz_chart_type" NAME="viz_chart_type" tabindex="200" onChange="prepareChartProperties(this.value)" > <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="" selected="selected">Bitte wählen Sie</option>
<option class="maskinput" value="sample">Beispiel</option> <xsl:for-each select="/ergebnisse/ergebnis/ergebniselement/vizTypes/vizType">
<option class="maskinput" value="bar_x">Balkendiagramm horizontal (einfach)</option> <option class="maskinput" value="{@uniquename}"><xsl:value-of select="@caption" /></option>
<option class="maskinput" value="bar_y">Balkendiagramm vertikal (einfach)</option> </xsl:for-each>
<option class="maskinput" value="line">Liniendiagramm vertikal (einfach)</option>
</select> </select>
</div> </div>
</p> </p>

Loading…
Cancel
Save