@ -142,27 +142,7 @@ function showChartPropertiesForm()
@@ -142,27 +142,7 @@ 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 ;
}
chartProperties = prepareForm ( chartType , vizTypeProperties ) ;
renderForm ( "chartPropertiesForm" , chartProperties , commonChartProperties ) ;
renderFormDetails ( "chartPropertiesFormDetails" , commonChartProperties ) ;
@ -307,7 +287,8 @@ function fillSelectionResultMetaData()
@@ -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="";
@@ -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)
@@ -657,7 +640,7 @@ function renderChartPropertyField(commonChartProperty)
default :
//Einfaches Texteingabefeld:
const inpElem = document . createElement ( "input" ) ;
inpElem . type = ;
inpElem . type = ( commonChartProperty . propValueType == "integer" ) ? "NUMBER" : ;
inpElem . size = 5 ;
if ( commonChartProperty . variableName == "" )
{
@ -882,6 +865,7 @@ var chartWidth=getCommonChartProperty("chartWidth");
@@ -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,7 +875,7 @@ var svg = d3.select("#"+chartDivElem).append("svg")
@@ -891,7 +875,7 @@ var svg = d3.select("#"+chartDivElem).append("svg")
. attr ( "id" , "chartSVG" )
;
svg . width = 50 ;
* /
switch ( chartType )
{
case "sample" :
@ -900,6 +884,9 @@ case "sample":
@@ -900,6 +884,9 @@ case "sample":
case "bar_x" :
makeBarX ( chartDivElem , selectionRs ) ;
break ;
case "bar_x_stacked" :
makeBarXStacked ( chartDivElem , selectionRs ) ;
break ;
case "bar_x_alt" :
makeBarX ( svg , data ) ;
break ;
@ -1028,11 +1015,12 @@ function makeSample()
@@ -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
@@ -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
@@ -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
@@ -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 += ;
//optionsString+= ",\"y\":{\"label\":\"Semester\"}";
optionsString += ", \"marks\":[]" ;
//optionsString+= ", \"marks\":"+JSON.stringify(marksArray)+"";
optionsString += ", \"caption\":\"" + myCaption + "\"" ;
@ -1101,98 +1092,57 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
@@ -1101,98 +1092,57 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
var styles = JSON . parse ( stylesString ) ;
var chartOptions = JSON . parse ( optionsString ) ;
chartOptions [ "marks" ] . push ( marksArray ) ;
/ * v a r s t y l e s = {
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);
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
} )
;
marksArray [ 1 ] = Plot . ruleX ( [ 0 ] ) ;
if ( textDim != "" )
marksArray [ 2 ] = Plot . text ( selectionRs ,
{
x : measureDim ,
y : categoryDim1 ,
text : textDim
} )
;
var options = getChartOptions ( categoryDim , measureDim , marksArray , false ) ;
/ * v a r s v g P l o t = P l o t . p l o t ( {
y : {
domain : d3 . sort ( selectionRs , d => - d . rownr ) . map ( d => d . dimension1Value )
} ,
x : {
grid : true
} ,
marks : [
Plot . barX ( selectionRs , { x : measureDim , y : categoryDim } )
]
} ) ; * /
var options = getChartOptions ( categoryDim1 , categoryDim2 , measureDim , marksArray , false ) ;
console . log ( "Options:" + JSON . stringify ( options ) ) ;
var svgPlot = Plot . plot ( options ) ;
document . getElementById ( chartDivElem ) . appendChild ( svgPlot ) ;
@ -1206,8 +1156,9 @@ 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) {
@@ -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) {
@@ -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) {
@@ -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 ) ) ;
}
