@ -160,7 +160,7 @@ function prepareChartProperties(chartType)
return false ; return false ;
break ; break ;
} }
renderForm ( "chartPropertiesForm" , chartProperties ) ; renderForm ( "chartPropertiesForm" , chartProperties , commonChartProperties ) ;
renderFormDetails ( "chartPropertiesFormDetails" , commonChartProperties ) ; renderFormDetails ( "chartPropertiesFormDetails" , commonChartProperties ) ;
return true ; return true ;
@ -366,39 +366,45 @@ function fillSelectionResult(selectionRsMetaData)
} }
function renderForm ( formDiv , myChartProperties ) function renderForm ( formDiv , myChartProperties , myCommonChartProperties )
{ {
//first empty form:
//first empty form:
var myForm = document . getElementById ( formDiv ) ; var myForm = document . getElementById ( formDiv ) ;
while ( myForm . firstChild ) { while ( myForm . firstChild ) {
myForm . removeChild ( myForm . firstChild ) ; myForm . removeChild ( myForm . firstChild ) ;
} }
/ * const columnsDiv = document . createElement ( "div" ) ;
const tabElem = document . createElement ( "table" ) ; columnsDiv . classList . add ( "columns" ) ;
for ( var k = 0 ; k < myChartProperties . length ; k ++ ) const columnDiv = document . createElement ( "div" ) ;
{ columnDiv . classList . add ( "column" ) ;
const rowElem = document . createElement ( "tr" ) ; columnDiv . classList . add ( "is-narrow" ) ;
const tdCap = document . createElement ( "td" ) ; const columnDivBox = document . createElement ( "div" ) ;
const textnode = document . createTextNode ( myChartProperties [ k ] . caption ) ; columnDivBox . classList . add ( "box" ) ;
tdCap . appendChild ( textnode ) ; columnDivBox . style = "width: 500px" ;
const tdSelElem = document . createElement ( "td" ) ;
const selElem = document . createElement ( "select" ) ;
selElem . name = myChartProperties [ k ] . name ;
selElem . id = myChartProperties [ k ] . name ;
fillSelectOptions ( selElem , myChartProperties [ k ] . getValueResultset ( ) , myChartProperties [ k ] . isMandatory ) ;
tdSelElem . appendChild ( selElem ) ;
rowElem . appendChild ( tdCap ) ;
rowElem . appendChild ( tdSelElem ) ;
//here values, and then:
tabElem . appendChild ( rowElem ) ;
}
myForm . appendChild ( tabElem ) ;
* /
for ( var k = 0 ; k < myChartProperties . length ; k ++ ) for ( var k = 0 ; k < myChartProperties . length ; k ++ )
{ {
myForm . appendChild ( renderDimensionField ( myChartProperties [ k ] ) ) ; columnDivBox . appendChild ( renderDimensionField ( myChartProperties [ k ] ) ) ;
} }
columnDiv . appendChild ( columnDivBox ) ;
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 ++ )
{
if ( myCommonChartProperties [ k ] . name == "chartCaption" )
columnDivBoxTitle . appendChild ( renderChartPropertyField ( myCommonChartProperties [ k ] ) ) ;
}
columnDivTitle . appendChild ( columnDivBoxTitle ) ;
columnsDiv . appendChild ( columnDivTitle ) ;
myForm . appendChild ( columnsDiv ) ;
} }
function renderDimensionField ( dimensionProperty ) function renderDimensionField ( dimensionProperty )
@ -495,7 +501,7 @@ var previousGroup="";
for ( var k = 0 ; k < myCommonChartProperties . length ; k ++ ) for ( var k = 0 ; k < myCommonChartProperties . length ; k ++ )
{ {
var groupUniquename = myCommonChartProperties [ k ] . groupUniquename ; var groupUniquename = myCommonChartProperties [ k ] . groupUniquename ;
if ( 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 ) ;
@ -553,39 +559,100 @@ function renderChartPropertyField(commonChartProperty)
inputParaElem . classList . add ( "control-new" ) ; inputParaElem . classList . add ( "control-new" ) ;
const inputElem = document . createElement ( "div" ) ; const inputElem = document . createElement ( "div" ) ;
inputElem . classList . add ( "is-small" ) ; inputElem . classList . add ( "is-small" ) ;
inputElem . classList . add ( "is-fullwidth" ) ; //inputElem.classList.add("is-fullwidth");
if ( commonChartProperty . inputType == "TEXT" )
{ switch ( commonChartProperty . inputType ) {
//Einfaches Texteingabefeld:
case "SELECT" :
const inpElem = document . createElement ( "input" ) ; //select input:
inpElem . type = "TEXT" ; inputElem . classList . add ( "select" ) ;
inpElem . size = 5 ; inputElem . classList . add ( "is-small" ) ;
inpElem . title = commonChartProperty . explanation ; const selElem = document . createElement ( "select" ) ;
inpElem . name = commonChartProperty . name ; selElem . name = commonChartProperty . name ;
inpElem . id = commonChartProperty . name ; selElem . id = commonChartProperty . name ;
inpElem . value = commonChartProperty . defaultValue ; selElem . title = commonChartProperty . explanation ;
inpElem . onchange = function ( ) {
//selElem.style="width:50px";
createChart ( 'chartDiv' ) ; if ( commonChartProperty . rendererUniquename == "" )
} ; {
inputElem . appendChild ( inpElem ) ; selElem . disabled = "disabled" ;
inputParaElem . appendChild ( inputElem ) ; selElem . readonly = "readonly" ;
}
selElem . onchange = function ( ) {
createChart ( 'chartDiv' ) ;
} ;
fillSelectOptions ( selElem , commonChartProperty . getValueResultset ( ) , commonChartProperty . isMandatory ) ;
inputElem . appendChild ( selElem ) ;
inputParaElem . appendChild ( inputElem ) ;
break ;
case "TEXTAREA" :
//großes Texteingabefeld:
const textAreaElem = document . createElement ( "textarea" ) ;
textAreaElem . cols = "20" ;
textAreaElem . rows = 3 ;
if ( commonChartProperty . rendererUniquename == "" )
{
textAreaElem . disabled = "disabled" ;
textAreaElem . readonly = "readonly" ;
}
textAreaElem . title = commonChartProperty . explanation ;
textAreaElem . name = commonChartProperty . name ;
textAreaElem . id = commonChartProperty . name ;
textAreaElem . value = commonChartProperty . defaultValue ;
textAreaElem . onchange = function ( ) {
createChart ( 'chartDiv' ) ;
} ;
inputElem . appendChild ( textAreaElem ) ;
inputParaElem . appendChild ( inputElem ) ;
break ;
case "RANGE" :
//Einfaches Texteingabefeld:
const rangeElem = document . createElement ( "input" ) ;
rangeElem . type = "RANGE" ;
rangeElem . min = commonChartProperty . range _from ;
rangeElem . max = commonChartProperty . range _to ;
rangeElem . step = 50 ;
if ( commonChartProperty . rendererUniquename == "" )
{
rangeElem . disabled = "disabled" ;
rangeElem . readonly = "readonly" ;
}
rangeElem . title = commonChartProperty . explanation ;
rangeElem . name = commonChartProperty . name ;
rangeElem . id = commonChartProperty . name ;
rangeElem . value = commonChartProperty . defaultValue ;
rangeElem . onchange = function ( ) {
createChart ( 'chartDiv' ) ;
} ;
inputElem . appendChild ( rangeElem ) ;
inputParaElem . appendChild ( inputElem ) ;
break ;
default :
//Einfaches Texteingabefeld:
const inpElem = document . createElement ( "input" ) ;
inpElem . type = "TEXT" ;
inpElem . size = 5 ;
if ( commonChartProperty . rendererUniquename == "" )
{
inpElem . disabled = "disabled" ;
inpElem . readonly = "readonly" ;
}
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 ) ;
break ;
} }
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 ) ; inputFieldElem . appendChild ( inputParaElem ) ;
fieldElem . appendChild ( inputFieldElem ) ; fieldElem . appendChild ( inputFieldElem ) ;
return fieldElem ; return fieldElem ;
@ -672,6 +739,10 @@ const tabElem = document.createElement("table");
tabElem . border = "1" ; tabElem . border = "1" ;
tabElem . width = "100%" ; tabElem . width = "100%" ;
const rowElem = document . createElement ( "tr" ) ; const rowElem = document . createElement ( "tr" ) ;
const thCap = document . createElement ( "th" ) ;
const textnode = document . createTextNode ( "Zeilennr." ) ;
thCap . appendChild ( textnode ) ;
rowElem . appendChild ( thCap ) ;
for ( var col = 0 ; col < metadata . length ; col ++ ) for ( var col = 0 ; col < metadata . length ; col ++ )
{ {
if ( metadata [ col ] . nr ) if ( metadata [ col ] . nr )
@ -689,6 +760,10 @@ for(row=1;row<rowcount;row++)
if ( data [ row ] ) if ( data [ row ] )
{ {
const rowElem = document . createElement ( "tr" ) ; const rowElem = document . createElement ( "tr" ) ;
const tdCap = document . createElement ( "td" ) ;
const textnode = document . createTextNode ( row ) ;
tdCap . appendChild ( textnode ) ;
rowElem . appendChild ( tdCap ) ;
for ( var col = 0 ; col < metadata . length ; col ++ ) for ( var col = 0 ; col < metadata . length ; col ++ )
{ {
if ( metadata [ col ] . nr ) if ( metadata [ col ] . nr )
@ -931,13 +1006,12 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
var categoryDim = document . getElementById ( "dimension1" ) . value ; var categoryDim = document . getElementById ( "dimension1" ) . value ;
var measureDim = document . getElementById ( "measure1" ) . value ; var measureDim = document . getElementById ( "measure1" ) . value ;
var fontSizeDefault = getCommonChartProperty ( "fontSize" ) + "pt" ; var fontSizeDefault = getCommonChartProperty ( "fontSize" ) + "pt" ;
var myCaption = getCommonChartProperty ( "chartCaption" ) ;
var chartWidth = getCommonChartProperty ( "chartWidth" ) ; var chartWidth = getCommonChartProperty ( "chartWidth" ) ;
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 myCaption = getCommonChartProperty ( "chartCaption" ) ; var marginLeftDefault = chartWidth / 5 ; //20% linker Rand
var marginLeftDefault = chartWidth / 5 ; //20% liner Rand
var marginBottomDefault = 100 ; var marginBottomDefault = 100 ;
var categoryLabel = getColumnCaption ( categoryDim ) ; var categoryLabel = getColumnCaption ( categoryDim ) ;
var measureLabel = getColumnCaption ( measureDim ) ; var measureLabel = getColumnCaption ( measureDim ) ;
@ -945,7 +1019,8 @@ function getChartOptions(categoryDim,measureDim,marksArray,chartOrientationVerti
for ( var k = 0 ; k < commonChartProperties . length ; k ++ ) for ( var k = 0 ; k < commonChartProperties . length ; k ++ )
{ {
if ( commonChartProperties [ k ] . groupUniquename == "STYLES" ) if ( commonChartProperties [ k ] . name != "" && ( commonChartProperties [ k ] . groupUniquename == "STYLE"
|| commonChartProperties [ k ] . groupUniquename == "LAYOUT" ) )
{ {
stylesString += ",\"" + commonChartProperties [ k ] . name + "\":\"" + getCommonChartProperty ( commonChartProperties [ k ] . name ) + "\"" ; stylesString += ",\"" + commonChartProperties [ k ] . name + "\":\"" + getCommonChartProperty ( commonChartProperties [ k ] . name ) + "\"" ;
} }
