/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
* コンストラクタ
* ---------------------------------------------------------------- */
gsi.graph.line = function (id) {

	this.canvas = document.getElementById(id);
	/* CANVAS要素 */
	if ( ! this.canvas ){ return; }
	if ( ! this.canvas.getContext ){
		this.canvas = G_vmlCanvasManager.initElement(this.canvas);
	}

	/* 2D コンテクストの生成 */
	this.ctx = this.canvas.getContext('2d');
	this.canvas.style.margin = "0";
	this.canvas.parentNode.style.position = "relative";
	this.canvas.parentNode.style.padding = "0";
};
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
* 描画
* ---------------------------------------------------------------- */
gsi.graph.line.prototype.draw = function(colors,data) {
	var params = {};
	params.colors = colors;
	params.data = data;
	var abspos = gsi.elements.getAbsolutePosition(this.canvas);
	params.position = {
		x:	abspos.x,
		y:	abspos.y
	};
	params.axis = {
		x:	this.canvas.width * 0.15,
		y:	this.canvas.height * 0.8,
		w:	this.canvas.width * 0.55,
		h:	this.canvas.width * 0.45
	};
	params.maxScale = data.maxScale;
//alert('data.maxScale= ' + data.maxScale)
	/* CANVASの背景を塗る */
	gsi.canvasUtils.drawBackground(this.canvas,colors.background);

	/* グラフの背景を塗りつぶす */
	this.drawGraphBackground(params);
	
	/* X軸横のラインを描く */
	this.drawHr(params);
	
	/* グラフの作成 */
	this.drawLine(params);
	
	/* X,Y軸項目を描く */
	this.drawAxis(params);
	
};

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
* 以下、内部関数
* ──────────────────────────────── */
gsi.graph.line.prototype.drawGraphBackground = function(params) 
{
	this.ctx.beginPath();
	this.ctx.moveTo(params.axis.x, params.axis.y);
	this.ctx.lineTo(params.axis.x + params.axis.w, params.axis.y);
	this.ctx.lineTo(params.axis.x + params.axis.w, params.axis.y - params.axis.h);
	this.ctx.lineTo(params.axis.x, params.axis.y - params.axis.h);
	this.ctx.closePath();
	var radgrad = this.ctx.createLinearGradient(params.axis.x,params.axis.y - params.axis.h,params.axis.x,params.axis.y);
	radgrad.addColorStop(1, "#6495ED");
	radgrad.addColorStop(0, "rgb(255,255,255)");
	this.ctx.fillStyle = radgrad;
	this.ctx.fill();
};
gsi.graph.line.prototype.drawHr = function(params) 
{
	for(var i=1; i<params.data.ycnt-1; i++) {
		var y = Math.round( params.axis.y - params.axis.h * ( params.data.caption.y[i+1]) / params.maxScale );
//		alert('y= ' + y);
		this.ctx.moveTo(params.axis.x , y);
		this.ctx.lineTo(params.axis.x + params.axis.w, y);
		this.ctx.stroke();

	}
};
gsi.graph.line.prototype.drawLine = function(params) 
{
	var plots = new Array();

	for(var i=0; i<params.data.graph.length; i++) {
		this.ctx.beginPath();
		this.ctx.lineJoin = "round";
		plots[i] = new Array();
		var n = params.data.graph[i].length;
//		var n = params.data.xcnt;
//		var n = params.data.caption.x.length;
//		alert('n = ' + n);
		gsi.canvasUtils.drawString(this.canvas, params.axis.w - 50, params.axis.y + 20, params.data.caption.x[0], params.data.graph[i][1]);
		gsi.canvasUtils.drawString(this.canvas, params.axis.x - 50, params.axis.h - 70, params.data.caption.y[0], params.data.graph[i][1]);
		for(var j=2; j<n; j++) {
			/* 項目の値 */
			var v = params.data.graph[i][j];
//			alert('params.data.graph[i][j]= ' + params.data.graph[i][j]);
			/* canvas座標を算出 */
			var p = {
				x: Math.round( params.axis.x + params.axis.w * ( j-2 ) / params.data.xcnt ),
				y: Math.round( params.axis.y - params.axis.h * (v) / params.maxScale ),
				v: v
			}
			plots[i].push(p);
			/* 線を描画 */
			if(j == 2) {
				this.ctx.moveTo(p.x, p.y);
			} else {
				this.ctx.lineTo(p.x, p.y);
			}
			gsi.canvasUtils.drawString(this.canvas,p.x-5,p.y-15,v,params.data.graph[i][1]);
		}

		/* 線の太さを定義 */
		
		this.ctx.lineWidth = 1;
		/* 線の色を定義 */
		this.ctx.strokeStyle = params.data.graph[i][1];
		/* 線を描画 */
		this.ctx.stroke();
		if(params.data.graph.length!=1)
		{
			var sx = params.axis.x + params.axis.w + 20;
			var sy = params.axis.y - params.axis.h + (20 * (i))
			//凡例文字表示
			gsi.canvasUtils.drawString(this.canvas,sx + 35, sy - 8, params.data.graph[i][0], params.data.graph[i][1]);
			this.ctx.beginPath();
			this.ctx.lineWidth = 1;
			this.ctx.strokeStyle = params.data.graph[i][1];
			this.ctx.moveTo(sx, sy);
			this.ctx.lineTo( sx+30, sy);
			this.ctx.stroke();
			this.ctx.closePath();
		}
		
	}
};
gsi.graph.line.prototype.drawAxis = function(params) 
{
	this.ctx.beginPath();
	this.ctx.lineWidth = 1;
	this.ctx.strokeStyle = "#000000";
	this.ctx.moveTo(params.axis.x, params.axis.y - params.axis.h);
	this.ctx.lineTo(params.axis.x, params.axis.y);
	this.ctx.lineTo(params.axis.x + params.axis.w, params.axis.y);
	this.ctx.stroke();
	this.ctx.closePath();
	for(var i=1; i<params.data.ycnt; i++) {
		var y = Math.round( params.axis.y - params.axis.h * ( params.data.caption.y[i]) / params.maxScale );
		gsi.canvasUtils.drawString(this.canvas, params.axis.x - 20, y - 10 , params.data.caption.y[i], "#000000");
	}
	for(var i=0; i<params.data.graph.length; i++) {
		var n = params.data.graph[i].length;
//		var n = params.data.xcnt;
		for(var j=2; j<n; j++) {
			/* 項目の値 */
			var v = params.data.caption.x[j];
//			alert('params.data.caption.x[j] ' + params.data.caption.x[j]);
			/* canvas座標を算出 */
			var p = {
				x: Math.round( params.axis.x + params.axis.w * ( j-2 ) / params.data.xcnt ),
				y: Math.round( params.axis.y - params.axis.h * (v) / params.maxScale ),
				v: v
			}
			
			 gsi.canvasUtils.drawString(this.canvas,p.x,params.axis.y,v,params.data.graph[i][1]);
		}
	}
};