Diagramm = Class.create();
Diagramm.prototype =
{
settings:$H(), //Array of settings
diagrammData:[], //Array of diagramm data
currentPosition:null, //pointer to current position
elementContainer:null, //pointer to div container for diagramm
output:null, //output code
initialize:function(divName)
{
this.elementContainer = $(divName);
this.currentPostion = 0;
this.diagrammData = [];
this.output = '';
Event.observe(divName+'_moveForward','click',this.moveForward.bindAsEventListener(this));
Event.observe(divName+'_moveBack','click',this.moveBack.bindAsEventListener(this));
},
loadSettings:function(config)
{
this.settings = $H();
this.settings['type'] = config['type'];
this.settings['width'] = config['width'];
this.settings['height'] = config['height'];
this.settings['spacer_top'] = config['spacer_top'];
this.settings['spacer_left'] = config['spacer_left'];
this.settings['balken_width'] = config['balken_width'];
this.settings['balken_margin_left'] = config['balken_margin_left'];
this.settings['scale_vert'] = config['scale_vert'];
this.settings['scale_hori'] = config['scale_hori'];
this.settings['balken_color'] = config['balken_color'];
},
loadData:function(diagrammData)
{
this.diagrammData = $H();
this.diagrammData = diagrammData;
},
getMaxParallel:function(tempArray,returnValue)
{
for(var i = 0 ; i < tempArray.length ; i++)
{
//save biggest value
if( tempArray[i] > returnValue)
{
returnValue = tempArray[i];
}
}
return returnValue;
},
getMaxSuperposed:function(tempArray,returnValue)
{
//set sum var to zero
sum = 0;
//loop over one row
for(var i = 0 ; i < tempArray.length ; i++)
{
//add values
sum += tempArray[i];
}
//save biggest value
if( sum > returnValue)
{
returnValue = sum;
}
return returnValue;
},
getMaxValue:function()
{
var keyArray = this.diagrammData.keys().sort();
//set return var to zero
var returnValue = 0;
//loop over data
for( record = parseInt(keyArray[keyArray.size()-1]); record >= parseInt(keyArray[0]); record--)
{
//check only visible bar
if(record > (this.currentPosition-this.settings['scale_vert']) && record <= this.currentPosition)
{
switch(this.settings['type'])
{
case "parallel":
returnValue = this.getMaxParallel(this.diagrammData[record],returnValue);
break;
case "superposed":
returnValue = this.getMaxSuperposed(this.diagrammData[record],returnValue);
break;
}
}
}
//round return value
returnValue = Math.ceil(returnValue);
//set return value to scale factor
while((returnValue % this.settings['scale_hori']) != 0) returnValue++;
//return value
return returnValue;
},
drawSuperposed:function()
{
//Output leer setzen
this.output = '';
//Maximalen Wert holen
var maxValue = this.getMaxValue();
//Skaleneinteilung sowie horizontale Linien zeichnen
for(var i = this.settings['scale_hori']; i > 0; i--)
{
var xpos = ((((this.settings['height']-this.settings['spacer_top'])/this.settings['scale_hori'])*(i-1))+this.settings['spacer_top']);
var scale_value = (maxValue / this.settings['scale_hori']) * (this.settings['scale_hori']-(i-1));
this.output += ""+ scale_value +"
";
}
//Vertikale Elemente zeichnen
for(var i = this.settings['scale_vert']; i > 0; i--)
{
//Aktuelle Position errechnen
var actPos = (this.currentPosition - this.settings['scale_vert'])+i;
//X-Position eines vertikalen Bereiches ermitteln
var xpos = ((((this.settings['width']-this.settings['spacer_left'])/this.settings['scale_vert'])*(i-1))+this.settings['spacer_left']);
//Abstand nach unten für den ersten Wert auf Nullsetzen
var bottom = 0;
//Über das Array loopen
for(var j = 0 ; j < this.diagrammData[actPos].length ; j++)
{
//Wenn Wert 0 dann nichts zeichen
if(this.diagrammData[actPos][j] != 0)
{
//Relative Balkenhöhe berechnen
var balken_height = this.diagrammData[actPos][j]*(this.settings['height']-this.settings['spacer_left'])/maxValue;
//Balkencontainer generieren
this.output += "
";
bottom += 9;
var left = xpos +this.settings['balken_margin_left'];
this.output += ""+ this.diagrammData[actPos][j] +"
";
}
else
{
this.output += "px;height:"+ balken_height +"px;width:"+ this.settings['balken_width'] +"px;margin-bottom:"+bottom+"px;\">"+ this.diagrammData[actPos][j] +"";
}
//Höhes des Aktuellen Balkens auf den Abstand nach Unten des nächsten Elements addieren
bottom += balken_height;
}
}
//Beschreibung des Vertikalen Balkencontainers zeichen
this.output += ""+ actPos +"
";
}
//Container mit Diagramm füllen
},
drawParallel:function()
{
//Output leer setzen
this.output = '';
//Maximalen Wert holen
var maxValue = this.getMaxValue();
//Skaleneinteilung sowie horizontale Linien zeichnen
for(var i = this.settings['scale_hori']; i > 0; i--)
{
var xpos = ((((this.settings['height']-this.settings['spacer_top'])/this.settings['scale_hori'])*(i-1))+this.settings['spacer_top']);
var scale_value = (maxValue / this.settings['scale_hori']) * (this.settings['scale_hori']-(i-1));
this.output += ""+ scale_value +"
";
}
//Über das Array loopen
for(var i = this.settings['scale_vert']; i > 0; i--)
{
//Aktuelle Position errechnen
var actPos = (this.currentPosition - this.settings['scale_vert'])+i;
//X-Position eines vertikalen Bereiches ermitteln
var xpos = ((((this.settings['width']-this.settings['spacer_left'])/this.settings['scale_vert'])*(i-1))+this.settings['spacer_left']);
//Über das Array loopen
for(var j = 0 ; j < this.diagrammData[actPos].length ; j++)
{
//Wenn Wert 0 dann nichts zeichen
if(this.diagrammData[actPos][j] != 0)
{
//Relative Balkenhöhe berechnen
var balken_height = this.diagrammData[actPos][j]*(this.settings['height']-this.settings['spacer_left'])/maxValue;
//Balkencontainer generieren
this.output += ""+ this.diagrammData[actPos][j] +"
";
}
}
//Beschreibung des Vertikalen Balkencontainers zeichen
this.output += ""+ actPos +"
";
}
},
moveForward:function(event)
{
var keyArray = this.diagrammData.keys().sort();
if(this.currentPosition < keyArray[keyArray.size()-1])
{
this.currentPosition++;
}
this.drawDiagramm();
},
moveBack:function(event)
{
var keyArray = this.diagrammData.keys().sort();
if(this.currentPosition >= (parseInt(keyArray[0])+this.settings['scale_vert']))
{
this.currentPosition--;
}
this.drawDiagramm();
},
drawDiagramm:function()
{
this.elementContainer.update();
switch(this.settings['type'])
{
case "parallel":
this.drawParallel();
break;
case "superposed":
this.drawSuperposed();
break;
}
this.elementContainer.update(this.output);
},
testDiagramm:function()
{
var keyArray = this.diagrammData.keys().sort();
this.currentPosition = parseInt(keyArray[keyArray.size()-1]);
this.elementContainer.style.width = this.settings['width']+"px";
this.elementContainer.style.height = this.settings['height']+"px";
this.drawDiagramm();
}
};