@ -38,7 +38,7 @@ this.value=value;
@@ -38,7 +38,7 @@ this.value=value;
this . isDefault = isDefault ;
}
function chart Property( name , caption , isMeasure , isMandatory )
function dimension Property( name , caption , isMeasure , isMandatory )
{
this . name = name ;
this . caption = caption ;
@ -172,9 +172,9 @@ function prepareBarXForm()
@@ -172,9 +172,9 @@ function prepareBarXForm()
{
var chartProperties = [ ] ;
var propertyCounter = 0 ;
var myProp = new chart Property( "viz_dimension1" , "Kategorie-Dimension" , false , true ) ;
var myProp = new dimension Property( "viz_dimension1" , "Kategorie-Dimension" , false , true ) ;
chartProperties [ 0 ] = myProp ;
var myProp = new chart Property( "viz_measure1" , "Maß" , true , true ) ;
var myProp = new dimension Property( "viz_measure1" , "Maß" , true , true ) ;
chartProperties [ 1 ] = myProp ;
return chartProperties ;
@ -184,11 +184,11 @@ function prepareBarYForm()
@@ -184,11 +184,11 @@ function prepareBarYForm()
{
var chartProperties = [ ] ;
var propertyCounter = 0 ;
var myProp = new chart Property( "viz_dimension1" , "Kategorie-Dimension" , true , false , true , null , null , true ) ;
var myProp = new dimension Property( "viz_dimension1" , "Kategorie-Dimension" , true , false , true , null , null , true ) ;
chartProperties [ 0 ] = myProp ;
var myProp = new chart Property( "viz_dimension2" , "Serien-Dimension" , true , false , false , null , null , true ) ;
var myProp = new dimension Property( "viz_dimension2" , "Serien-Dimension" , true , false , false , null , null , true ) ;
chartProperties [ 1 ] = myProp ;
var myProp = new chart Property( "viz_measure1" , "Maß" , true , true , true , null , null , true ) ;
var myProp = new dimension Property( "viz_measure1" , "Maß" , true , true , true , null , null , true ) ;
chartProperties [ 2 ] = myProp ;
return chartProperties ;
@ -198,11 +198,11 @@ function prepareLineForm()
@@ -198,11 +198,11 @@ function prepareLineForm()
{
var chartProperties = [ ] ;
var propertyCounter = 0 ;
var myProp = new chart Property( "viz_dimension1" , "Kategorie-Dimension" , true , false , true , null , null , true ) ;
var myProp = new dimension Property( "viz_dimension1" , "Kategorie-Dimension" , true , false , true , null , null , true ) ;
chartProperties [ 0 ] = myProp ;
var myProp = new chart Property( "viz_dimension2" , "Serien-Dimension" , true , false , false , null , null , true ) ;
var myProp = new dimension Property( "viz_dimension2" , "Serien-Dimension" , true , false , false , null , null , true ) ;
chartProperties [ 1 ] = myProp ;
var myProp = new chart Property( "viz_measure1" , "Maß" , true , true , true , null , null , true ) ;
var myProp = new dimension Property( "viz_measure1" , "Maß" , true , true , true , null , null , true ) ;
chartProperties [ 2 ] = myProp ;
return chartProperties ;
@ -212,9 +212,9 @@ function prepareLineForm_alt()
@@ -212,9 +212,9 @@ function prepareLineForm_alt()
{
var chartProperties = [ ] ;
var propertyCounter = 0 ;
var myProp = new chart Property( "dimension1" , "X-Achse" , true , false , true , null , null , true ) ;
var myProp = new dimension Property( "dimension1" , "X-Achse" , true , false , true , null , null , true ) ;
chartProperties [ 0 ] = myProp ;
var myProp = new chart Property( "measure1" , "Y-Achse" , true , true , true , null , null , true ) ;
var myProp = new dimension Property( "measure1" , "Y-Achse" , true , true , true , null , null , true ) ;
chartProperties [ 1 ] = myProp ;
return chartProperties ;
@ -397,6 +397,12 @@ function renderForm(formDiv,myChartProperties)
@@ -397,6 +397,12 @@ function renderForm(formDiv,myChartProperties)
* /
for ( var k = 0 ; k < myChartProperties . length ; k ++ )
{
myForm . appendChild ( renderDimensionField ( myChartProperties [ k ] ) ) ;
}
}
function renderDimensionField ( dimensionProperty )
{
const fieldElem = document . createElement ( "div" ) ;
fieldElem . classList . add ( "field" ) ;
fieldElem . classList . add ( "is-grouped" ) ;
@ -407,7 +413,7 @@ function renderForm(formDiv,myChartProperties)
@@ -407,7 +413,7 @@ function renderForm(formDiv,myChartProperties)
label . classList . add ( "label" ) ;
label . classList . add ( "is-required" ) ;
label . classList . add ( "is-small" ) ;
const textnode = document . createTextNode ( myChartProperties [ k ] . caption ) ;
const textnode = document . createTextNode ( dimensionProperty . caption ) ;
label . appendChild ( textnode ) ;
labelElem . appendChild ( label ) ;
fieldElem . appendChild ( labelElem ) ;
@ -423,17 +429,18 @@ function renderForm(formDiv,myChartProperties)
@@ -423,17 +429,18 @@ function renderForm(formDiv,myChartProperties)
inputSelectElem . classList . add ( "is-fullwidth" ) ;
const selElem = document . createElement ( "select" ) ;
selElem . name = myChartProperties [ k ] . name ;
selElem . id = myChartProperties [ k ] . name ;
fillSelectOptions ( selElem , myChartProperties [ k ] . getValueResultset ( ) , myChartProperties [ k ] . isMandatory ) ;
selElem . name = dimensionProperty . name ;
selElem . id = dimensionProperty . name ;
selElem . onchange = function ( ) {
createChart ( 'chartDiv' ) ;
} ;
fillSelectOptions ( selElem , dimensionProperty . getValueResultset ( ) , dimensionProperty . isMandatory ) ;
inputSelectElem . appendChild ( selElem ) ;
inputParaElem . appendChild ( inputSelectElem ) ;
inputFieldElem . appendChild ( inputParaElem ) ;
fieldElem . appendChild ( inputFieldElem ) ;
return fieldElem ;
myForm . appendChild ( fieldElem ) ;
}
}
function renderFormDetails ( formDiv , myCommonChartProperties )
@ -443,8 +450,8 @@ function renderFormDetails(formDiv,myCommonChartProperties)
@@ -443,8 +450,8 @@ function renderFormDetails(formDiv,myCommonChartProperties)
while ( myForm . firstChild ) {
myForm . removeChild ( myForm . firstChild ) ;
}
/ *
const tabElem = document . createElement ( "table" ) ;
//tabElem.caption="Eigenschaften";
for ( var k = 0 ; k < myCommonChartProperties . length ; k ++ )
{
const rowElem = document . createElement ( "tr" ) ;
@ -452,7 +459,7 @@ function renderFormDetails(formDiv,myCommonChartProperties)
@@ -452,7 +459,7 @@ function renderFormDetails(formDiv,myCommonChartProperties)
const textnode = document . createTextNode ( myCommonChartProperties [ k ] . caption ) ;
tdCap . appendChild ( textnode ) ;
rowElem . appendChild ( tdCap ) ;
if ( myCommonChartProperties [ k ] . inputType == 0 )
if ( myCommonChartProperties [ k ] . inputType == "TEXT" )
{
//Einfaches Texteingabefeld:
const tdInpElem = document . createElement ( "td" ) ;
@ -466,7 +473,7 @@ function renderFormDetails(formDiv,myCommonChartProperties)
@@ -466,7 +473,7 @@ function renderFormDetails(formDiv,myCommonChartProperties)
}
else
{ // Klappmenü:
{
const tdSelElem = document . createElement ( "td" ) ;
const selElem = document . createElement ( "select" ) ;
selElem . name = myCommonChartProperties [ k ] . name ;
@ -475,11 +482,76 @@ function renderFormDetails(formDiv,myCommonChartProperties)
@@ -475,11 +482,76 @@ function renderFormDetails(formDiv,myCommonChartProperties)
tdSelElem . appendChild ( selElem ) ;
rowElem . appendChild ( tdSelElem ) ;
}
//here values, and then:
tabElem . appendChild ( rowElem ) ;
}
myForm . appendChild ( tabElem ) ;
//TODO: myCommonChartProperties auf separatem TAB
* /
for ( var k = 0 ; k < myCommonChartProperties . length ; k ++ )
{
myForm . appendChild ( renderChartPropertyField ( myCommonChartProperties [ k ] ) ) ;
}
}
function renderChartPropertyField ( commonChartProperty )
{
const fieldElem = document . createElement ( "div" ) ;
fieldElem . classList . add ( "field" ) ;
fieldElem . classList . add ( "is-grouped" ) ;
//label:
const labelElem = document . createElement ( "div" ) ;
labelElem . classList . add ( "label-container" ) ;
const label = document . createElement ( "label" ) ;
label . classList . add ( "label" ) ;
label . classList . add ( "is-required" ) ;
label . classList . add ( "is-small" ) ;
const textnode = document . createTextNode ( commonChartProperty . caption ) ;
label . appendChild ( textnode ) ;
labelElem . appendChild ( label ) ;
fieldElem . appendChild ( labelElem ) ;
//input:
const inputFieldElem = document . createElement ( "div" ) ;
inputFieldElem . classList . add ( "field" ) ;
//inputFieldElem.classList.add("is-active");
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" ) ;
if ( commonChartProperty . inputType == "TEXT" )
{
//Einfaches Texteingabefeld:
const inpElem = document . createElement ( "input" ) ;
inpElem . type = "TEXT" ;
inpElem . size = 15 ;
inpElem . title = commonChartProperty . explanation ;
inpElem . name = commonChartProperty . name ;
inpElem . id = commonChartProperty . name ;
inpElem . value = commonChartProperty . defaultValue ;
inpElem . onchange = function ( ) {
createChart ( 'chartDiv' ) ;
} ;
inputElem . appendChild ( inpElem ) ;
inputParaElem . appendChild ( inputElem ) ;
}
else
{
//select input:
inputElem . classList . add ( "select" ) ;
const selElem = document . createElement ( "select" ) ;
selElem . name = commonChartProperty . name ;
selElem . id = commonChartProperty . name ;
selElem . title = commonChartProperty . explanation ;
selElem . onchange = function ( ) {
createChart ( 'chartDiv' ) ;
} ;
fillSelectOptions ( selElem , commonChartProperty . getValueResultset ( ) , commonChartProperty . isMandatory ) ;
inputElem . appendChild ( selElem ) ;
inputParaElem . appendChild ( inputElem ) ;
}
inputFieldElem . appendChild ( inputParaElem ) ;
fieldElem . appendChild ( inputFieldElem ) ;
return fieldElem ;
}
function fillSelectOptions ( myCombo , myValues , isMandatory )
@ -642,15 +714,18 @@ for(row=1;row<rowcount;row++)
@@ -642,15 +714,18 @@ for(row=1;row<rowcount;row++)
}
tableDiv . appendChild ( tabElem ) ;
}
function createChart ( chartDivElem )
function showChartDiv ( chartDivElem )
{
chartType = document . getElementById ( "viz_chart_type" ) . value ;
var myDiv = document . getElementById ( chartDivElem ) ;
if ( myDiv . style . display == "block" )
myDiv . style . display = "none" ;
else
myDiv . style . display = "block" ;
}
function createChart ( chartDivElem )
{
chartType = document . getElementById ( "viz_chart_type" ) . value ;
var selectionRsMetaData = [ ] ;
var selectionRs = [ ] ;
@ -677,6 +752,7 @@ var svg = d3.select("#"+chartDivElem).append("svg")
@@ -677,6 +752,7 @@ var svg = d3.select("#"+chartDivElem).append("svg")
. attr ( "text-anchor" , "start" )
. attr ( "id" , "chartSVG" )
;
svg . width = 50 ;
switch ( chartType )
{
@ -827,13 +903,27 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
@@ -827,13 +903,27 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
var marginBottomDefault = 100 ;
var categoryLabel = getColumnCaption ( categoryDim ) ;
var measureLabel = getColumnCaption ( measureDim ) ;
var styles = {
var stylesString = "{\"overflow\": \"visible\"" ;
for ( var k = 0 ; k < commonChartProperties . length ; k ++ )
{
if ( commonChartProperties [ k ] . groupUniquename == "STYLES" )
{
stylesString += ",\"" + commonChartProperties [ k ] . name + "\":\"" + getCommonChartProperty ( commonChartProperties [ k ] . name ) + "\"" ;
}
}
stylesString += " }" ;
console . log ( "Styles:" + stylesString ) ;
var styles = JSON . parse ( stylesString ) ;
/ * v a r s t y l e s = {
backgroundColor : myBgColor ,
color : myColor ,
fontFamily : myFontFamily ,
fontSize : fontSizeDefault ,
overflow : "visible"
}
} * /
if ( chartOrientationVertical )
{
