function init(){
		if(VAR_graphRows > 0){var eg = new exGraphs($_("visitorsGraph"));}
	}

var exGraphs = new Class({
	vars: {canvas:"",pageWidth:0,ctx:"",width:"",height:"",bottomLine:19,lastPoint:"",mondays:[],maxRelative:{"count":-1,"flag":"A"},maxRelatives:[]},
	init: function(elem,width,height){
		extend(this.vars,{"canvas":elem,pageWidth:$T("BODY")[0].offsetWidth,"ctx":lc.getContext(elem),"lastPoint":"","mondays":$A([])});
		/* Porque no nos podemos salir del marco */
		this.vars.width = elem.width = (width ? width : elem.parentNode.offsetWidth);
		this.vars.height = elem.height;

		$_("itracking_header",{onmouseout:function(){if($_("info_graphHolder")){removeThemeInfo($_("info_graphHolder"));}}})
		var stats = this.renderData();
	},
	renderData: function(data){
		//FIXME: crear el canvas aqui mismo
		var bottomLine = this.vars.bottomLine;var width = this.vars.width;var height = this.vars.height;

		/* Buscamos el nodo superior */
		var stats = {baseTable:(height-bottomLine),highNode:0,middle:0,total:0,countNodes:0,offsetHeight:0,nodeIncrement:0,highDate:"",lowDate:""};
		for(a in VAR_visits){if(VAR_visits[a] > stats.highNode){stats.highNode = VAR_visits[a];}stats.total += VAR_visits[a];stats.countNodes++;if(a > stats.highDate){stats.highDate = a;}}
		stats.middle = stats.total/stats.countNodes;
		/* El incremento de cada punto */
		stats.offsetHeight = (132-bottomLine-25)/stats.highNode;
		stats.nodeIncrement = width/(VAR_graphRows);
			/* WorkAround para cuadrarlo todo */
			stats.nodeIncrement = Math.floor(stats.nodeIncrement);
			/* Almacenamos el overflow para pintarlo de blanco */
			var graphOverflow = this.vars.width;
			this.vars.width = stats.nodeIncrement*VAR_graphRows;
			graphOverflow -= this.vars.width;
		var initOffsetLeft = stats.nodeIncrement/2;

		/* Creamos la línea bajo la cual se escriben la leyenda de principio de cada semana */
		this.drawHorizontalLine(this.vars.height-this.vars.bottomLine,"#666");

		//this.vars.ctx.$at({font:"11px verdana",fillStyle:"#666"}).$fillText("Visits count - Peak: "+stats.highNode+" - Middle: "+$round(stats.middle),4,12);
		/* Establecemos la media */
		this.drawHorizontalLine(stats.baseTable-stats.middle*stats.offsetHeight);

		/* Ponemos marcador a todos los lunes de la franja de tiempo */
		var offsetLeft = initOffsetLeft;for(a in VAR_visits){
			var d = a.split("-");var weekDay = new Date(d[0],(d[1]-1),d[2]).getDay();
			if(weekDay == 1){this.vars.mondays.push(a);this.drawVerticalMarker(offsetLeft-initOffsetLeft,a);}
			offsetLeft += stats.nodeIncrement;
		}

		/* INI-Creamos las lineas y sacamos los máximos relativos */
		var maxRelativesFlags = ["A","B","C","D","E","F","G"];
		var offsetLeft = initOffsetLeft;for(a in VAR_visits){
			/* Aprobechando la primera vuelta marcaremos los pico relativos, evitamos que si el primer dia es un lunes
			 * se introduzca un número erróneo */
			if(this.vars.mondays.find(a) > -1 && this.vars.maxRelative.count > -1){
				this.vars.maxRelatives[this.vars.maxRelative.date] = extend(this.vars.maxRelative,{"end":a});
				this.vars.maxRelative = {"count":-1,"flag":maxRelativesFlags[$A(maxRelativesFlags).find(this.vars.maxRelative.flag)+1],"start":a};
			}
			if(VAR_visits[a] > this.vars.maxRelative.count){extend(this.vars.maxRelative,{"count":VAR_visits[a],"date":a,"x":offsetLeft,"y":stats.baseTable-VAR_visits[a]*stats.offsetHeight});}

			/* Creamos las lineas */
			this.createLines(offsetLeft,stats.baseTable-VAR_visits[a]*stats.offsetHeight);
			offsetLeft += stats.nodeIncrement;
		}
//FIXME: si el dia final no es lunes nos falta el ultimo nodo
//metemos el ultimo dia, pero no funcionará si es lunes, se duplicará
		this.vars.maxRelatives[this.vars.maxRelative.date] = this.vars.maxRelative;
		/* END-Creamos las lineas y sacamos los máximos relativos */

		/* Por cada máximo relativo dibujamos una banderita */
		for(a in this.vars.maxRelatives){this.drawFlagLabel(this.vars.maxRelatives[a]);}

		/* Creamos los puntos de union */
		var offsetLeft = initOffsetLeft;for(a in VAR_visits){this.createNode(offsetLeft,stats.baseTable-VAR_visits[a]*stats.offsetHeight,a,VAR_visits[a],stats.nodeIncrement);offsetLeft += stats.nodeIncrement;}

		/* Creamos el marco del canvas */
		this.drawFrameLine();

		/* INI-rellenamos con blanco el sobrante */
		this.vars.ctx.$save().$beginPath().$at({fillStyle:"#FFF"}).$moveTo(this.vars.width,0).$lineTo(this.vars.width+graphOverflow,0).$lineTo(this.vars.width+graphOverflow,this.vars.height).$lineTo(this.vars.width,this.vars.height).$fill().$closePath().$restore();
		/* END-rellenamos con blanco el sobrante */

		/* Creamos la regla de los días */
		this.renderDayRule(stats);
	},
	renderDayRule: function(stats){
		var h = $_("graphHolder_dayRule",{".position":"relative"});
		var elem = $C("CANVAS",{width:this.vars.width,height:19},h);
		extend(this.vars,{"canvas":elem,"ctx":lc.getContext(elem),height:19});

		var offsetLeft = 0;for(a in VAR_visits){
			var nodeWidth = parseInt(offsetLeft+stats.nodeIncrement)-parseInt(offsetLeft)-1;
			var nodeLeft = parseInt(offsetLeft);if(nodeLeft == 0){nodeLeft++;nodeWidth--;}
//FIXME: a CSS
			var d = $C("DIV",{".position":"absolute",".lineHeight":"16px",".background":"#efefef",".textAlign":"center",".width":nodeWidth+"px",".height":"18px",".top":"0px",".left":nodeLeft+"px"},h);
			$C("A",{href:VAR_baseURL+a.replace(/\-/g,"/")+"/",".color":"#0077cc",".fontWeight":"bold",".textDecoration":"none",".fontSize":"9px",innerHTML:a.replace(/^[0-9]{4}\-[0-9]{2}\-/,"")},d);
			this.drawVerticalLine(parseInt(offsetLeft));offsetLeft += stats.nodeIncrement;
		}

		/* Creamos el marco del canvas */
		this.drawFrameLine();
	},
	drawClassEvaluationPoints: function(stats){
		for(a in VAR_classEvaluationPoints){
			offsetLeft = 5+(stats.nodeIncrement*VAR_classEvaluationPoints[a]['y']);
			this.drawVerticalMarker(offsetLeft,VAR_classEvaluationPoints[a]['leyend']);
		}
	},
	drawHorizontalLine: function(y,color){
		if(!color){color = "#CCC";}
		var bottomLine = this.vars.bottomLine;var width = this.vars.width;var height = this.vars.height;
		this.vars.ctx.$save().$beginPath().$at({fillStyle:color,lineWidth:1}).$moveTo(0,y).$lineTo(width,y).$lineTo(width,y+1).$lineTo(0,y+1).$fill().$closePath().$restore();
	},
	drawVerticalLine: function(x,color){
		if(!color){color = "#AAA";}
		var width = this.vars.width;var height = this.vars.height;
		this.vars.ctx.$save().$beginPath().$at({fillStyle:color,lineWidth:1}).$moveTo(x-1,0).$lineTo(x,0).$lineTo(x,height).$lineTo(x-1,height).$fill().$closePath().$restore();
	},
	drawVerticalMarker: function(x,label){
		var bottomLine = this.vars.bottomLine;var width = this.vars.width;var height = this.vars.height;
		this.vars.ctx.$save().$beginPath().$at({fillStyle:"#AAA",lineWidth:1}).$moveTo(x-1,0).$lineTo(x,0).$lineTo(x,height).$lineTo(x-1,height).$fill().$closePath().$restore();
		if(label){this.vars.ctx.$at({font:"9px sans-serif",fillStyle:"black"}).$fillText(label,x+4,this.vars.height-6);}
	},
	drawFrameLine: function(noTop,noLeft,noBottom,noRight){
		if(!noTop){this.drawHorizontalLine(0,"#AAA");}if(!noBottom){this.drawHorizontalLine(this.vars.height-1,"#AAA");}
		if(!noLeft){this.drawVerticalLine(1,"#AAA");}if(!noRight){this.drawVerticalLine(this.vars.width,"#AAA");}
	},
	drawFlagLabel: function(point){
//FIXME: pasar el objeto entero y sacar las propiedades, ademas poner una leyenda
//alert(print_r(point));
		if(point.count == -1){return;}
		var y = parseInt(point.y)+0.70;var x = parseInt(point.x)+0.5;var height = 13;var width = 15;var stick = 16;var label = point.flag;
		/* El mastil de la bandera */
		this.vars.ctx.$beginPath().$at({strokeStyle:"#676767",fillStyle:"white"}).$moveTo(x,y).$lineTo(x,y-stick).$closePath().$stroke()
		/* El fondo de la bandera */
		.$moveTo(x,y-stick).$beginPath().$lineTo(x,y-stick-height-2).$lineTo(x+width,y-stick-height-2).$lineTo(x+width,y-stick).$lineTo(x,y-stick).$closePath().$fill();

		this.vars.ctx.$beginPath().$at({strokeStyle:"#BBB"}).$moveTo(x-1,y-stick-1).$lineTo(x-1,y-stick-height-1).$closePath().$stroke()
		.$beginPath().$moveTo(x,y-stick-height-2).$lineTo(x+width,y-stick-height-2).$closePath().$stroke()
		.$beginPath().$at({strokeStyle:"#7d7d7d"}).$moveTo(x+width+1,y-stick-height-1).$lineTo(x+width+1,y-stick-1).$closePath().$stroke()
		.$beginPath().$moveTo(x,y-stick).$lineTo(x+width,y-stick).$closePath().$stroke();

		var len = this.vars.ctx.$at({font:"11px verdana",fillStyle:"#0077cc"}).measureText(label);
		this.vars.ctx.$fillText(label,x+(width-len.width)/2,y-stick-(height/2)+3);

//FIXME: terminar
		//var h = $_("itracking_header");
		//$C("DIV",{innerHTML:label+" period:"+point.start+" - "+point.end+" peak:"+point.count},h);
	},
	createLines: function(x,y){
		if(!this.vars.lastPoint){this.vars.lastPoint = {"x":x,"y":y};return;}
		this.vars.ctx.$save().$beginPath().$at({strokeStyle:"#0077cc",lineWidth:4}).$moveTo(this.vars.lastPoint.x,this.vars.lastPoint.y).$closePath().$lineTo(x,y).$stroke().$restore();
		this.vars.lastPoint = {"x":x,"y":y}
	},
	createNode: function(x,y,date,visits,nodeIncrement){
		var h = this.vars.canvas.parentNode;
		this.vars.ctx.$beginPath().$at({fillStyle:"#0077cc",strokeStyle:"#FFFFFF",lineWidth:1}).$arc(x,y,4.5,0,Math.PI*2,false).$closePath().$fill().$stroke();
		var p = $C("DIV",{id:"leyendPoint_"+escape(date),className:"leyendPoint"/*,".background":"green"*/,".width":"10px",".height":"10px",".left":(x-4)+"px",".top":(y-3)+"px"},h);

		var vars = this.vars;
		$C("DIV",{className:"leyendBlock",".zIndex":2000,".width":nodeIncrement+"px",".left":(x-(nodeIncrement/2))+"px",onmouseover:function(){
			if(!VAR_itracking.graphShowPointLegend){return;}
			if(!$_("info_graphHolder")){createThemeInfo("graphHolder");}

			var i = $_("info_graphHolder",{".left":"-10px"});p.appendChild(i);
			var pos = $getOffsetPosition(i);var rpos = vars.pageWidth-pos.left-pos.width;
			if(rpos < 1){i.style.left = rpos-23+"px"}
			var i = $_("info_graphHolder_container").empty();
			$C("DIV",{innerHTML:"Estadísticas "+date},i);
			$C("DIV",{innerHTML:"visitas: "+visits},i);
		}},h);
	}
});