/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
* コンストラクタ
* ---------------------------------------------------------------- */
gsi.graph.radarChart = 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.radarChart.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.data.hosei = params.data.hosei == undefined ? 0 : params.data.hosei;
	params.circle = gsi.calc.getCircleObject(this.canvas.width,this.canvas.height);
	params.polygon = gsi.calc.getPolygonObject(params.data.cnt);
	params.maxScale = data.maxScale;
	params.interval = data.interval;
	params.intervalLabel = data.intervalLabel;
	// 背景描画
	gsi.canvasUtils.drawBackground(this.canvas,colors.background);
	this.drawChartBase(params);
	
	//等高線の表示
	this.drawScaleLine(params);

	//中心から外の放射線
	this.drawAxis(params);

	//等高線の値表示
	this.drawScaleLabel(params);
	
	//レーダーチチャートを描く
	for(var i=0; i<params.data.graph.length; i++) {
		this.drawChart(params,params.data.graph[i]);
	}

	//周りの項目名
	this.drawLabel(params);
	
	//凡例
	this.drawInfo(params);
};

/* ------------------------------------------------------------------
チャートの形状を描画
* ---------------------------------------------------------------- */
gsi.graph.radarChart.prototype.drawChartBase = function(params)
{
	var circle = params.circle;
	var polygon = params.polygon;
	
	this.ctx.beginPath();
	this.ctx.moveTo(circle.x, circle.y - circle.r);
	for(var i=0; i<params.data.cnt; i++) {
		var x = Math.round( circle.x + circle.r * Math.cos(polygon.angles[i]) );
		var y = Math.round( circle.y - circle.r * Math.sin(polygon.angles[i]) );
		this.ctx.lineTo(x, y);
	}
	this.ctx.closePath();
	this.ctx.fillStyle = params.colors.graph.base;
	this.ctx.fill();
};
gsi.graph.radarChart.prototype.drawScaleLine = function(params)
{
	var circle = params.circle;
	var polygon = params.polygon;
	var interval = params.intervalLabel;
	var k = 0;

	for(var i=0; i<params.maxScale; i++) {

		if(0==(i+1)%interval){
			var r = circle.r * ( k+1) / (params.maxScale/interval);
			if( r <= 0 ) { continue; }
			this.ctx.beginPath();
			this.ctx.lineWidth = 1;
			this.ctx.strokeStyle = params.colors.graph.line;
			
			this.ctx.moveTo( Math.round( circle.x + r * Math.cos(polygon.angles[0]) ), Math.round( circle.y - r * Math.sin(polygon.angles[0]) ) );
			for(var j=1; j<params.data.cnt; j++) {
				this.ctx.lineTo( Math.round( circle.x + r * Math.cos(polygon.angles[j]) ), Math.round( circle.y - r * Math.sin(polygon.angles[j]) ) );
			}
			this.ctx.closePath();
			this.ctx.stroke();
			k++;
		}
	}
};
gsi.graph.radarChart.prototype.drawAxis = function(params)
{
	var circle = params.circle;
	var polygon = params.polygon;
	for(var i=0; i<polygon.cnt; i++) {
		this.ctx.beginPath();
		this.ctx.lineWidth = 1;
		this.ctx.strokeStyle = params.colors.graph.line;
		this.ctx.moveTo(circle.x, circle.y);
		this.ctx.lineTo( Math.round( circle.x + circle.r * Math.cos(polygon.angles[i]) ), Math.round( circle.y - circle.r * Math.sin(polygon.angles[i]) ) );
		this.ctx.stroke();
	}
};
gsi.graph.radarChart.prototype.drawScaleLabel = function(params)
{
	var j=0;
	var interval = params.intervalLabel;

	for(var i=0; i<params.maxScale; i++)
	{
		if(0==(i+1)%interval){
			var circle = params.circle;
			var x = Math.round( circle.x + 20 )-2;
			var y = Math.round( circle.y - ( ( (j+1) - 1 ) * circle.r / ( params.maxScale / interval) ) - ( 28 ) )+8;
			gsi.canvasUtils.drawString(this.canvas,x, y, (i+1), params.colors.graph.scale);
			j++;
		}
	}
};

gsi.graph.radarChart.prototype.drawChart = function(params,graph)
{
	/* チャート面を塗りつぶす */
	if(graph[graph.length-1]){
		this.makeChartPath(params, graph);
		this.ctx.globalAlpha = 0.2;
		this.ctx.fillStyle = graph[1];
		this.ctx.fill();
	}
	
	this.makeChartPath(params, graph);
	if(graph[graph.length-1]){
		this.ctx.globalAlpha = 0.5;
		this.ctx.lineWidth = 2;
	}else{
		this.ctx.globalAlpha = 1;
		this.ctx.lineWidth = 2;
	}
	
	this.ctx.strokeStyle = graph[1];
	this.ctx.stroke();
	
	/* this.ctx.globalAlpha の値を初期値に戻す */
	this.ctx.globalAlpha = 1;
};
gsi.graph.radarChart.prototype.makeChartPath = function(params,graph)
{
	var circle = params.circle;
	var polygon = params.polygon;
	var r0 = 0;
	r0 = circle.r * (graph[2]  ) / (params.data.maxScale);
	if( r0 < 0 ) { r0 = 0; }
	
	this.ctx.beginPath();
	this.ctx.moveTo( Math.round( circle.x + r0 * Math.cos(polygon.angles[0]) ), Math.round( circle.y - r0 * Math.sin(polygon.angles[0]) ) );
	//alert("****");
	for(var i=1; i<polygon.cnt; i++) {
		var r = 0;
		r = circle.r * ( graph[i+2] ) / (params.data.maxScale);
		if( r < 0 ) { r = 0; }
		
		
			this.ctx.lineTo( Math.round( circle.x + r * Math.cos(polygon.angles[i]) ), Math.round( circle.y - r * Math.sin(polygon.angles[i]) ) );
			//alert(Math.round( circle.x + r * Math.cos(polygon.angles[i]) )+":"+ Math.round( circle.y - r * Math.sin(polygon.angles[i]) ));
	//	if(i==polygon.cnt-1){
	//		this.ctx.lineTo( Math.round( circle.x + r0 * Math.cos(polygon.angles[0]) ), Math.round( circle.y - r0 * Math.sin(polygon.angles[0]) ) );
	//	}
	}
	this.ctx.closePath();

};
gsi.graph.radarChart.prototype.drawLabel = function(params)
{
	var n = params.data.cnt;
	var circle = params.circle;
	var polygon = params.polygon;
	
	for(var i=0; i<n; i++) {
		var text = params.data.caption[i];
		/* テキスト領域のサイズを算出 */
		var w = 80;
		var h = 10;
		/* テキストを描画すべき左上端の座標を算出 */
		var ang = polygon.angles[i];
		var x = circle.x + circle.r * 1.15 * Math.cos(ang) - w / 2;
		var y = circle.y - circle.r * 1.15 * Math.sin(ang) - h / 2;
		x = Math.round(x)-5;
		y = Math.round(y);
		/* テキストを描画 */
		gsi.canvasUtils.drawString(this.canvas,x+50+params.data.hosei, y, text, params.colors.caption);
	}
};
gsi.graph.radarChart.prototype.drawInfo = function(params) {
	var w = 80;
	var h = 10;
	var circle = params.circle;
	var polygon = params.polygon;
	/* 凡例の各種座標を算出 */
	var lpos = {
		x: Math.round( circle.x + circle.r + this.canvas.width * 0.15 )-100,
		y: Math.round( ( this.canvas.height - ( h * params.data.graph.length + h * 0.2 * (params.data.graph.length - 1) ) ) / 2 ) -100,
		h: h
	};
	lpos.cx = lpos.x + Math.round( lpos.h * 1.5 ); // 文字表示開始位置(x座標)
	lpos.cw = this.canvas.width - lpos.cx;         // 文字表示幅
	/* 描画 */
	for(var i=0; i<params.data.graph.length; i++) {
		/* 文字 */
		lpos.y = lpos.y + 2;
		gsi.canvasUtils.drawString(this.canvas,lpos.cx + 60 + params.data.hosei, lpos.y -9 , params.data.graph[i][0], params.data.graph[i][1]);
		lpos.y = lpos.y - 2;
		this.ctx.beginPath();
		this.ctx.lineWidth = 1;
		this.ctx.strokeStyle = params.data.graph[i][1];
		this.ctx.moveTo(lpos.cx, lpos.y);
		this.ctx.lineTo( lpos.cx+30, lpos.y);
		this.ctx.stroke();
		this.ctx.closePath();
		
		lpos.y = lpos.y + lpos.h * 1.2;
	}
};
gsi.graph.radarChart.prototype.makeInfoPath = function(x,y,w,h) {
	this.ctx.beginPath();
	this.ctx.moveTo(x, y);
	this.ctx.lineTo(x+w, y);
	this.ctx.lineTo(x+w, y+h);
	this.ctx.lineTo(x, y+h);
	this.ctx.closePath();
};