// Copyright 2007 futomi  http://www.html5.jp/
// graph_line ver 1.0.1  2007-12-17
// since 2007-10-17
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
//   http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.

if( typeof html5jp == 'undefined' ) {
	html5jp = new Object();
}
if( typeof html5jp.graph == 'undefined' ) {
	html5jp.graph = new Object();
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
* コンストラクタ
* ---------------------------------------------------------------- */
html5jp.graph.line = function (id) {
	var elm = document.getElementById(id);
	if(! elm) { return; }
	//tf-web.jp 小文字で帰ってくす場合があるので、toUpperCase()で大文字化
	//if(elm.nodeName != "CANVAS") { return; }
	if(elm.nodeName.toUpperCase() != "CANVAS") { return; }
	if(elm.parentNode.nodeName != "DIV") { return; };
	this.canvas = elm;
	
	//tf-web 追加
	//IEの場合 G_vmlCanvasManager.initElement を呼び出す
	if(document.uniqueID) this.canvas = G_vmlCanvasManager.initElement(this.canvas);
	
	/* CANVAS要素 */
	if ( ! this.canvas ){ return; }
	if ( ! this.canvas.getContext ){ return; }
	/* 2D コンテクストの生成 */
	this.ctx = this.canvas.getContext('2d');
	this.canvas.style.margin = "0";
	this.canvas.parentNode.style.position = "relative";
	this.canvas.parentNode.style.padding = "0";
};
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
* 描画
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype.draw = function(items, inparams) {

	this.ctx.clearRect(0, 0, 515, 500);

	if( ! this.ctx ) {return;}
	this.items = items;
	/* パラメータの初期化 */
	var params = {
		x: [],
		y: [],
		c: ['','','','','','','','','','','','','','','','','','','','','','','','','','','','','','',''],
		yMax: null,
		yMin: 0,
		horizon_val: 0,
		//backgroundColor: "#ffffff",
		backgroundColor: "#ffffe0",
		//backgroundColor: "#0000ff",
		//gBackgroundColor: "#dddddd",
		gBackgroundColor: "#ffffff",
		//gGradation: true,
		gGradation: false,
		barShape: "flat",
		barColors: null,
		//_barColors: ["rgb(24,41,206)", "rgb(198,0,148)", "rgb(214,0,0)", "rgb(255,156,0)", "rgb(33,156,0)", "rgb(33,41,107)", "rgb(115,0,90)", "rgb(132,0,0)", "rgb(165,99,0)", "rgb(24,123,0)"],
		//_barColors: ["rgb(255,99,99)", "rgb(255,156,0)", "rgb(214,0,0)", "rgb(198,0,148)", "rgb(33,156,0)", "rgb(33,41,107)", "rgb(115,0,90)", "rgb(132,0,0)", "rgb(165,99,0)", "rgb(24,123,0)"],
		_barColors: ["rgb(255,175,00)", "rgb(255,204,0)", "rgb(255,204,0)", "rgb(255,204,0)", "rgb(255,204,0)", "rgb(255,204,0)", "rgb(255,204,0)", "rgb(255,204,0)", "rgb(255,204,0)", "rgb(255,204,0)" ],
		barGradation: true,
		barAlpha: 0.7,
		borderAlpha: 0.2,
		lineWidth: 1,
		dotRadius: 3,
		dotType: "disc",
		hLineWidth: 2,
		hLineType: "dotted",
		hLineColor: "#aaaaaa",
		xAxisWidth: 1,
		//xAxisColor: "#aaaaaa",
		xAxisColor: "#000000",
		yAxisWidth: 1,
		//yAxisColor: "#aaaaaa",
		yAxisColor: "#000000",
		xScale: true,
		xScaleColor: "#000000",
		xScaleFontSize: "10px",
		xScaleFontFamily: "Arial,sans-serif",
		yScale: true,
		yScaleColor: "#000000",
		yScaleFontSize: "10px",
		yScaleFontFamily: "Arial,sans-serif",
		xCaptionColor: "#000000",
		xCaptionFontSize: "12px",
		xCaptionFontFamily: "Arial,sans-serif",
		yCaptionColor: "#000000",
		yCaptionFontSize: "12px",
		yCaptionFontFamily: "Arial,sans-serif",
		aLineWidth: 1,
		aLineAlpha: 0.2,
		dLabel: true,
		dLabelColor: "#000000",
		dLabelFontSize: "10px",
		dLabelFontFamily: "Arial,sans-serif",
		gTitle: "",
		legend: false,
		legendFontSize: "12px",
		legendFontFamily: "Arial,sans-serif",
		legendColor: "#000000",
target_jikan_title : "",
target_gotobed_title : "",
target_getup_title : "",
target_jikan_title : "",
target_jikan_width : 2,
target_jikan_color : "#FF3333",
target_jikan_value : 0,
target_jikan_type : 2,
target_gotobed_width : 2,
target_gotobed_color : "#003399",
target_gotobed_value : 0,
target_gotobed_type : 2,
target_getup_width : 2,
target_getup_color : "#009900",
target_getup_value : 0,
target_getup_type : 2,
display_type : "disp_all",
                dummy: ""
	};
	if( inparams && typeof(inparams) == 'object' ) {
		for( var key in inparams ) {
			if( key.match(/^_/) ) { continue; }
			params[key] = inparams[key];
		}
	}
	if( params.barColors != null && params.barColors.length > 0 ) {
		for( var i=0; i<params._barColors.length; i++ ) {
			var c = params.barColors[i];
			var co = this._csscolor2rgb(c);
			if( co == null ) {
				params.barColors[i] = params._barColors[i];
			} else {
				params.barColors[i] = c;
			}
		}
	} else {
		params.barColors = params._barColors;
	}
	this.params = params;
	/* CANVAS要素の横幅が縦幅の1.5倍未満、または縦幅が200未満であれば凡例は強制的に非表示 */
	if(this.canvas.width / this.canvas.height < 1.5 || this.canvas.height < 200) {
		params.legend == false;
	}
	/* 項目の数（最大10個） */
	var item_num = items.length;
	if(item_num > 10) { item_num = 10; }
	/* 最大項目数を算出 */
	var max_n = 0;
	for(var i=0; i<item_num; i++) {
		var n = items[i].length;
		if(n < 2) { continue; }
		if(n - 1 >= max_n) {
			max_n = n - 1;
		}
	}
	params.max_n = max_n;
	if(max_n == 0) {
		throw new Error('no graph item data.' + n);
	}

	/* 全項目の最大値・最小値と項目数を算出 */
	var max_v = null;
	var min_v = null;
	var max_n = 0;
	if(params.y.length > 1) {
		max = params.y[ params.y.length - 1 ];
	}
	for(var i=0; i<item_num; i++) {
		var n = items[i].length;
		if(n < 2) { continue; }
		for(var j=1; j<n; j++) {
			var v = items[i][j];
			if( isNaN(v) ) {
				throw new Error('invalid graph item data.' + n);
			}
			if(max_v == null) {
				max_v = v;
			} else if(v >= max_v) {
				max_v = v;
			}
			if (v>0) { // 最小値は０より大きい
				if(min_v == null) {
					min_v = v;
				} else if(v <= min_v) {
					min_v = v;
				}
			}
		}
		if(n - 1 >= max_n) {
			max_n = n - 1;
		}
	}

	// 目標就寝時間、目標起床時間がある場合に最小値、最大値に反映
	var t_gotobed = params.target_gotobed_value + 24;
	var t_getup = params.target_getup_value + 24;
//alert("t_gotobed: "+t_gotobed+", t_getup: "+t_getup+"");

	if (params.display_type=='gotobed' || params.display_type=='all') {
		if (min_v == null || t_gotobed < min_v) {
			min_v = t_gotobed;
		}
		if (t_gotobed > max_v) {
			max_v = t_gotobed;
		}
	}
	if (params.display_type=='getup' || params.display_type=='all') {
		if (min_v == null || t_getup < min_v) {
			min_v = t_getup;
		}
		if (t_getup > max_v) {
			max_v = t_getup;
		}
	}
//alert("max_v: "+max_v+", min_v: "+min_v+", max_n: "+max_n);






	if( typeof(params.yMin) != "number" ) {
		params.yMin = 0;
		//params.yMin = min_v - Math.abs(max_v - min_v) * 0.1; // 強制的に書き換え
	}
	if( typeof(params.yMax) != "number" ) {
		params.yMax = max_v + Math.abs(max_v - min_v) * 0.1;
	}
	var v_range = Math.abs( params.yMax - params.yMin );

	params.horizon_val = Math.floor(min_v)-1; // y=0の位置にどの値をもってくるかを計算
//alert("horizon_val: "+params.horizon_val);

	for (var i=0; i<item_num; i++) {
                var n = items[i].length;
                if(n < 2) { continue; }
                for(var j=1; j<n; j++) {
                        var v = items[i][j];
			if (v>0) {
				items[i][j] = v - params.horizon_val;
			}
		}
	}
	max_v = max_v - params.horizon_val;
	min_v = min_v - params.horizon_val;
	params.yMin = 0;
	params.yMax = params.yMax - params.horizon_val+1;
	var v_range = Math.abs( params.yMax - params.yMin );
//alert(params.display_type);

//alert("max_v: "+max_v+", min_v: "+min_v+", max_n: "+max_n);
//alert("yMin: "+params.yMin+", yMax: "+params.yMax);







	/* 補助線の位置を自動算出 */
	if( params.y.length < 2 ) {
		params.aLinePositions = this._aline_positions_auto_calc(params.yMin, params.yMax);
	} else {
		params.aLinePositions = params.y.slice(1);
	}
	/* グラフの軸のcanvas内座標 */
	var cpos = {
		x0: this.canvas.width * 0.05,
		y0: this.canvas.height * 0.95,
		x1: this.canvas.width * 0.95,
		y1: this.canvas.height * 0.05
	};
	if(params.legend == true) {
		cpos.x1 = this.canvas.width * 0.7;
	}
	if(params.x.length > 0) {
		var x_caption_text_size = this._getTextBoxSize("あa", params.xCaptionFontSize, params.xCaptionFontFamily);
		cpos.y0 -= x_caption_text_size.h * 1.5;
		cpos.x_caption_y = cpos.y0 + x_caption_text_size.h/2;
	}
	if(params.xScale == true || params.x.length > 1) {
		var x_scale_text_size = this._getTextBoxSize("あa", params.xScaleFontSize, params.xScaleFontFamily);
		cpos.y0 -= x_scale_text_size.h * 1.5;
		cpos.x_scale_y = cpos.y0 + x_scale_text_size.h * 0.7;
	}
	if(params.y.length > 0) {
		var y_caption_text_size = this._getTextBoxSize("あa", params.yCaptionFontSize, params.yCaptionFontFamily);
		cpos.y1 += y_caption_text_size.h * 1.5;
		cpos.y_caption_y = cpos.y1 - y_caption_text_size.h * 1.5;
	}
	if(params.yScale == true || params.y.length > 1) {
		var y_scale_text_size = this._getTextBoxSize(params.aLinePositions[params.aLinePositions.length-1].toString(), params.yScaleFontSize, params.yScaleFontFamily);
		cpos.x0 += y_scale_text_size.w * 1.1;
	}
	cpos.w = cpos.x1 - cpos.x0;
	cpos.h = cpos.y0 - cpos.y1;
	/* 棒の幅の半径を算出 */
	if(params.barShape == "square") {
		cpos.r = 0.6 * cpos.w / max_n / 2;
	} else {
		cpos.r = 0.7 * cpos.w / max_n / 2;
	}
	if(cpos.r < 5 && cpos.r >=3) {
		//params.barShape = "line";
	}
	params.cpos = cpos;
	/* */
	this.params = params;
	/* CANVASの背景を塗る */
	this._draw_canvas_background();
	/* グラフの背景を描画 */
	this._draw_graph_background();

	/* 土、日、祭日を表示 */
	var x_scale_positions = new Array();
	for(var i=1; i<=max_n; i++) {
		/* x軸座標 */
		var x = cpos.x0 + (i - 0.5) * ( cpos.w / max_n );
		x_scale_positions.push(x);
	}
	this._draw_x_scale_background(this.ctx, x_scale_positions);


	/* 水平補助線 */
	if( typeof(params.hLineWidth) == "number" && params.hLineWidth > 0 ) {
		var h_line_type = "dashed";
		if( params.hLineType.match(/^(solid|dashed|dotted)$/i) ) {
			h_line_type = params.hLineType;
		}
		for(var i=1; i<params.y.length; i++) {
			var aline_x0 = cpos.x0;
			var aline_y0 = Math.round( cpos.y0 - cpos.h * ( params.y[i] - params.yMin ) / v_range );
			var aline_x1 = cpos.x1;
			this._draw_h_aline(aline_x0, aline_y0, aline_x1, params.hLineWidth, h_line_type, params.hLineColor);
		}
	}

	/* 各項目のデフォルト色を定義 */
	//var colors = ["24,41,206", "198,0,148", "214,0,0", "255,156,0", "33,156,0", "33,41,107", "115,0,90", "132,0,0", "165,99,0", "24,123,0"];
	var colors = ["#0099FF", "#99CC00"];
	/* 折線グラフを描写 */
	var plots = new Array();
	for(var i=0; i<item_num; i++) {
		this.ctx.beginPath();
		var move_to_flag = 0;
		this.ctx.lineJoin = "round";
		plots[i] = new Array();
		var n = items[i].length;
		for(var j=1; j<n; j++) {
			/* 項目の値 */
			var v = items[i][j];
			if(v <= 0) { continue; } // Added
			/* canvas座標を算出 */
			var p = {
				x: Math.round( cpos.x0 + cpos.w * ( j - 0.5 ) / max_n ),
				y: Math.round( cpos.y0 - cpos.h * ( v - params.yMin ) / v_range ),
				v: v
			}
			plots[i].push(p);
			/* 線を描画 */
			if(move_to_flag ==0 && p.x != "" && p.y != "") {
			//if(j == 1){
				this.ctx.moveTo(p.x, p.y);
				move_to_flag = 1;
			} else {
				this.ctx.lineTo(p.x, p.y);
			}
		}
		/* 線の太さを定義 */
		var line_width = 1;
		if( typeof(params.lineWidth) == "object" && ! isNaN(params.lineWidth[i])) {
			line_width = params.lineWidth[i];
		} else if( typeof(params.lineWidth) == "number" && ! isNaN(params.lineWidth)) {
			line_width = params.lineWidth;
		}
		this.ctx.lineWidth = line_width;
		/* 線の色を定義 */

		if(params.display_type != "getup"){
			var line_color = colors[i];
		}else{
			var line_color = colors[1];
		}
		this.ctx.strokeStyle = line_color;
		/* 線を描画 */
		this.ctx.stroke();
		/* ドットの半径を特定 */
		var dot_rad = null;
		if( typeof(params.dotRadius) == "object" && ! isNaN(params.dotRadius[i]) && params.dotRadius[i] > 0 ) {
			dot_rad = params.dotRadius[i];
		} else if( typeof(params.dotRadius) == "number" && ! isNaN(params.dotRadius) && params.dotRadius > 0 ) {
			dot_rad = params.dotRadius;
		}
		/* ドットのタイプを特定 */
		var dot_type = null;
		if( typeof(params.dotType) == "object" && typeof(params.dotType[i]) == "string" ) {
			dot_type = params.dotType[i];
		} else if( typeof(params.dotType) == "string" ) {
			dot_type = params.dotType;
		} else {
			dot_type = "disc";
		}
		/* ドットを描画 */
		if(dot_rad > 0) {
			for(var k=0; k<plots[i].length; k++) {
				this._draw_dot(plots[i][k].x, plots[i][k].y, dot_rad, dot_type, line_color);
				//this._draw_dot(plots[i][k].x, plots[i][k].y, dot_rad, dot_type, colors[i]);
			}
		}
		/* データラベルを描画 */
		if(params.dLabel == true) {
			for(var k=0; k<plots[i].length; k++) {
				if(plots[i][k].x < cpos.x0 || plots[i][k].x > cpos.x1 || plots[i][k].y > cpos.y0 || plots[i][k].y < cpos.y1) {
					continue;
				}
				var dlabel = plots[i][k].v.toString();
				var margin = 1;
				if(dot_rad != null && dot_rad > 0) {
					margin += dot_rad;
				}
				var s = this._getTextBoxSize(dlabel, params.dLabelFontSize, params.dLabelFontFamily);
				var dlabel_x = plots[i][k].x - Math.round( s.w / 2 );
				var dlabel_y = plots[i][k].y - Math.round( s.h ) - margin;
				//this._drawText(dlabel_x, dlabel_y, dlabel, params.dLabelFontSize, params.dLabelFontFamily, params.dLabelColor);
			}
		}
		/* 凡例を描画 */
		if(params.legend == true) {
			/* 文字 */
			this._drawText(lpos.cx, lpos.y, items[i][0], params.legendFontSize, params.legendFontFamily, params.legendColor);
			/* 記号（罫線） */
			this._draw_h_aline(lpos.x, Math.round(lpos.y+lpos.h/2), lpos.x + lpos.h*2, line_width, "solid", line_color);
			/* 記号（ドット） */
			if(dot_rad > 0) {
				this._draw_dot(Math.round(lpos.x+lpos.h), Math.round(lpos.y+lpos.h/2), dot_rad, dot_type, colors[i]);
			}
			/* */
			lpos.y = lpos.y + lpos.h * 1.2;
		}
	}























	/* 棒グラフを描写 */
	var x_scale_positions = new Array();
	var d_labels = new Array();
	for(var i=1; i<=max_n; i++) {
		var sum = 0;
		/* x軸座標 */
		var x = cpos.x0 + (i - 0.5) * ( cpos.w / max_n );
		x_scale_positions.push(x);
		/* */
		for(var j=0; j<items.length; j++) {
			/* 項目の値 */
			var v = items[j][i];
			/* 棒の底辺の位置 */
			var y = cpos.y0 - sum * cpos.h / params.yMax;
			/* 棒の高さ */
			var h = v * cpos.h / params.yMax;
			/* 棒を描画 */
			if( params.barShape == "line" ) {
				this._draw_vertical_bar_line(this.ctx, x, y, h, cpos.r, params.barColors[j], params.barAlpha);
			} else if( params.barShape == "flat" ) {
if (h > 0) {
				//this._draw_vertical_bar_flat(this.ctx, x, y, h, cpos.r, params.barColors[j], params.barAlpha, params.borderAlpha, params.barGradation);
}
			} else if( params.barShape == "square" ) {
				this._draw_vertical_bar_square(this.ctx, x, y, h, cpos.r, cpos.r/3, params.barColors[j], params.barAlpha, params.borderAlpha, params.barGradation);
			} else if( params.barShape == "cylinder" ) {
				this._draw_vertical_bar_cylinder(this.ctx, x, y, h, cpos.r, cpos.r/3, params.barColors[j], params.barAlpha, params.borderAlpha, params.barGradation);
			}
			/* 値の和を算出 */
			sum += v;
		}
		d_labels.push( { x:x, v:sum } );
	}


/* 目標線を描画 (2008/05/02)*/
	if (params.display_type=='gotobed') {
		this._draw_target_line(params.target_gotobed_type, params.target_gotobed_width, params.target_gotobed_color, params.target_gotobed_value);
		this._draw_target_label(params.target_gotobed_type, params.target_gotobed_width, params.target_gotobed_color, 360, 485, 50, params.target_gotobed_title);
	}
	if (params.display_type=='getup') {
		this._draw_target_line(params.target_getup_type, params.target_getup_width, params.target_getup_color, params.target_getup_value);
		this._draw_target_label(params.target_getup_type, params.target_getup_width, params.target_getup_color, 360, 485, 50, params.target_getup_title);
	}
	if (params.display_type=='all') {
		this._draw_target_line(params.target_gotobed_type, params.target_gotobed_width, params.target_gotobed_color, params.target_gotobed_value);
		this._draw_target_line(params.target_getup_type, params.target_getup_width, params.target_getup_color, params.target_getup_value);
		this._draw_target_label(params.target_gotobed_type, params.target_gotobed_width, params.target_gotobed_color, 360, 485, 50, params.target_gotobed_title);
		this._draw_target_label(params.target_getup_type, params.target_getup_width, params.target_getup_color, 360, 465, 50, params.target_getup_title);

	}




	/* データラベルを描画 */
	//this._draw_data_label(d_labels);
	/* x軸目盛とキャプションを表示 */
	this._draw_x_scale_label(x_scale_positions);
	/* y軸目盛とキャプションを表示 */
	this._draw_y_scale_label();
	/* タイトルを表示 */
	this._draw_title(x_scale_positions);
	/* 月間合計睡眠時間を表示 */
	this._draw_sum_sleep(x_scale_positions);
	/* 凡例を描画 */
	this._draw_legend();
};

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
* 以下、内部関数
* ──────────────────────────────── */

/* ------------------------------------------------------------------
データラベルを描画
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._draw_data_label = function(labels) {
	var p = this.params;
	if( p.dLabel != true ) { return; }
	var n = labels.length;
	var pos = new Array();
	var max_w = 0;
	for( var i=0; i<n; i++ ) {
		var text = labels[i].v.toString();
		var s = this._getTextBoxSize(text, p.dLabelFontSize, p.dLabelFontFamily);
		max_w = Math.max(s.w, max_w);
		var dx = labels[i].x - s.w / 2;
		var dy = p.cpos.y0 - labels[i].v * p.cpos.h / p.yMax - s.h * 1.3;
if (text=="0") {
  text = "";
}
		pos.push( { x:dx, y:dy, text:text } );
	}
	//if( max_w < p.cpos.w / n ) {
		for( var i=0; i<n; i++ ) {
			this._drawText(pos[i].x, pos[i].y, pos[i].text, p.dLabelFontSize, p.dLabelFontFamily, p.dLabelColor);
		}
	//}
};
/* ------------------------------------------------------------------
凡例を描画
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._draw_legend = function() {
	var p = this.params;
	if(p.legend != true) { return; }
	/* DIV要素を仮に挿入してみて高さを調べる(1行分の高さ) */
	var s = this._getTextBoxSize('あTEST', p.legendFontSize, p.legendFontFamily);
	/* 凡例の各種座標を算出 */
	var item_num = this.items.length;
	var lpos = {
		x: Math.round( p.cpos.x1 + this.canvas.width * 0.05 ),
		y: Math.round( ( this.canvas.height - ( s.h * item_num + s.h * 0.2 * (item_num - 1) ) ) / 2 ),
		h: s.h
	};
	lpos.cx = lpos.x + Math.round( lpos.h * 1.5 ); // 文字表示開始位置(x座標)
	lpos.cw = this.canvas.width - lpos.cx;         // 文字表示幅
	/* 描画 */
	for(var i=0; i<item_num; i++) {
		/* 文字 */
		this._drawText(lpos.cx, lpos.y, this.items[i][0], p.legendFontSize, p.legendFontFamily, p.legendColor);
		/* 記号（背景） */
		this.ctx.save();
		this._make_path_legend_mark(lpos.x, lpos.y, s.h, s.h);
		this.ctx.fillStyle = p.gBackgroundColor;
		this.ctx.fill();
		this.ctx.restore();
		/* 記号（塗り） */
		this.ctx.save();
		this._make_path_legend_mark(lpos.x, lpos.y, s.h, s.h);
		this.ctx.fillStyle = p.barColors[i];
		this.ctx.globalAlpha = p.barAlpha;
		this.ctx.fill();
		this.ctx.restore();
		/* 枠線 */
		this.ctx.save();
		this._make_path_legend_mark(lpos.x, lpos.y, s.h, s.h);
		this.ctx.strokeStyle = p.barColors[i];
		this.ctx.globalAlpha = p.borderAlpha;
		this.ctx.stroke();
		this.ctx.restore();
		/* グラデーション */
		if( ! document.uniqueID && p.barGradation == true ) {
			this.ctx.save();
			this._make_path_legend_mark(lpos.x, lpos.y, s.h, s.h);
			var grad = this.ctx.createLinearGradient(lpos.x, lpos.y, lpos.x+s.h, lpos.y+s.h);
			grad.addColorStop(0, "rgba(0, 0, 0, 0.1)");
			grad.addColorStop(0.3, "rgba(255, 255, 255, 0.1)");
			grad.addColorStop(1, "rgba(0, 0, 0, 0.4)");
			this.ctx.fillStyle = grad;
			this.ctx.fill();
			this.ctx.restore();
		}
		lpos.y = lpos.y + lpos.h * 1.2;
	}
};
html5jp.graph.line.prototype._make_path_legend_mark = 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();
};
/* ------------------------------------------------------------------
補助線の位置を自動算出
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._aline_positions_auto_calc = function(min, max) {
	var range = max - min;
//alert(min);
	var power10 = Math.floor( Math.log(range) / Math.log(10) );
	var unit = Math.pow( 10,  power10);
	if( (Math.log(range) / Math.log(10)) % 1 == 0 ) {
		unit = unit / 10;
	}
	var keta_age = 1;
	if(unit < 1) {
		keta_age += Math.abs(power10);
	}
	var p = Math.pow(10, keta_age);
	range = range * p;
	unit = unit * p;
	min = min * p;
	max = max * p;
	var array = [min];
	var unum = range / unit;
//alert(unum);
	if( unum > 5 ) {
		unit = unit * 2;
	} else if( unum < 2 ) {
		//unit = unit * 3 / 10
		unit = unit * 1 / 10
	}
	var i = 1;
	while(min+unit*i<=max) {
		array.push(min+unit*i);
		i++;
	}
	for(var i=0; i<array.length; i++) {
		array[i] = array[i] / p;
//alert(array[i]);
	}
	return array;
};
/* ------------------------------------------------------------------
タイトルを表示
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._draw_title = function(pos) {
	var p = this.params;
	if( p.gTitle.length > 0 ) {
		/* x軸キャプションテキスト */
		var text = p.gTitle.toString();
		if(text != "") {
			/* x軸キャプションテキスト領域のサイズを算出 */
			var s = this._getTextBoxSize(text, p.xCaptionFontSize, p.xCaptionFontFamily);
			/* x軸キャプションテキストを描画すべき左上端の座標を算出 */
			var x = Math.round( p.cpos.x0 + p.cpos.w/2 - s.w/2 );
			/* x軸キャプションテキストを描画 */
			//this._drawText(x, p.cpos.x_caption_y, text, p.xCaptionFontSize, p.xCaptionFontFamily, p.xCaptionColor);
			this._drawText(x, 5, text, p.xCaptionFontSize, p.xCaptionFontFamily, p.xCaptionColor);
		}
	}
};
/* ------------------------------------------------------------------
月間睡眠時間合計を表示
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._draw_sum_sleep = function(pos) {
	var p = this.params;
	if( p.sum_jikan.length > 0 ) {
		/* x軸キャプションテキスト */
		var text = p.sum_jikan;
		if(text != "") {
			/* x軸キャプションテキスト領域のサイズを算出 */
			var s = this._getTextBoxSize(text, p.xCaptionFontSize, p.xCaptionFontFamily);
			/* x軸キャプションテキストを描画すべき左上端の座標を算出 */
			var x = Math.round( p.cpos.x0 + p.cpos.w/2 - s.w/2 );
			/* x軸キャプションテキストを描画 */
			//this._drawText(x, p.cpos.x_caption_y, text, p.xCaptionFontSize, p.xCaptionFontFamily, p.xCaptionColor);
			this._drawText(x, 20, text, p.xCaptionFontSize, p.xCaptionFontFamily, p.xCaptionColor);
		}
	}
};
/* ------------------------------------------------------------------
y軸目盛とキャプションを表示
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._draw_y_scale_label = function(pos) {
	var p = this.params;
	if( p.y.length > 0 ) {
		/* y軸キャプションテキスト */
		var text = p.y[0].toString();
		if(text != "") {
			/* y軸キャプションテキスト領域のサイズを算出 */
			var s = this._getTextBoxSize(text, p.yCaptionFontSize, p.yCaptionFontFamily);
			/* y軸キャプションテキストを描画すべき左上端の座標を算出 */
			var x = p.cpos.x0 - s.w/2;
			if(x < this.canvas.width*0.05) {
				x = this.canvas.width*0.05;
			}
			/* y軸キャプションテキストを描画 */
			this._drawText(x, p.cpos.y_caption_y, text, p.yCaptionFontSize, p.yCaptionFontFamily, p.yCaptionColor);
		}
	}

	if( p.yScale == true && p.aLinePositions.length > 0 ) {
		for( var i=0; i<p.aLinePositions.length; i++ ) {
			var v = p.aLinePositions[i];

			if(v > p.yMax) { continue; }
			var text = "";
			if ((v+p.horizon_val) >= 24) {
				text = v+p.horizon_val-24;
			} else {
				text = v+p.horizon_val;
			}
			var s = this._getTextBoxSize(text, p.yScaleFontSize, p.yScaleFontFamily);
			var x = p.cpos.x0 - p.cpos.r/2 - s.w*1.1;
			var y = p.cpos.y0 - v * p.cpos.h / (p.yMax - p.yMin) - s.h/2;
			if( p.barShape == "cylinder" || p.barShape == "square" ) {
				var d = p.cpos.r / 3;
				y += d;
			}
			this._drawText(x, y, text, p.yScaleFontSize, p.yScaleFontFamily, p.yScaleColor);
		}
	}
};
/* ------------------------------------------------------------------
x軸目盛とキャプションを表示
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._draw_x_scale_label = function(pos) {
	var p = this.params;
	if( p.x.length > 0 ) {
		/* x軸キャプションテキスト */
		var text = p.x[0].toString();
		if(text != "") {
			/* x軸キャプションテキスト領域のサイズを算出 */
			var s = this._getTextBoxSize(text, p.xCaptionFontSize, p.xCaptionFontFamily);
			/* x軸キャプションテキストを描画すべき左上端の座標を算出 */
			var x = Math.round( p.cpos.x0 + p.cpos.w/2 - s.w/2 );
			/* x軸キャプションテキストを描画 */
			this._drawText(x, p.cpos.x_caption_y, text, p.xCaptionFontSize, p.xCaptionFontFamily, p.xCaptionColor);
		}
	}
	if( p.xScale == true && p.x.length > 1 ) {
		for(var i=0; i<pos.length; i++) {
			if(i + 1 > p.x.length - 1) { break; }
			/* x軸目盛テキスト */
			var text = p.x[i+1].toString();
			if(text == "") { continue; }
			/* x軸目盛テキスト領域のサイズを算出 */
			var s = this._getTextBoxSize(text, p.xScaleFontSize, p.xScaleFontFamily);
			/* x軸目盛テキストを描画すべき左上端の座標を算出 */
			var x = Math.round( pos[i] - s.w / 2 );
			/* x軸目盛テキストを描画 */
                        var fcolor = p.xScaleColor;
			if (p.c[i+1].toString()==0) { /* 日曜日 */
			  fcolor="#FF0000";
			} else if (p.c[i+1].toString()==6) { /* 土曜日 */
			  fcolor="#0000FF";
			} else if (p.c[i+1].toString()==7) { /* 祭日 */
			  fcolor="#FF6600";
			}
			//this._drawText(x, p.cpos.x_scale_y-5, text, p.xScaleFontSize, p.xScaleFontFamily, p.xScaleColor);
			this._drawText(x, p.cpos.x_scale_y-5, text, p.xScaleFontSize, p.xScaleFontFamily, fcolor);
		}
	}
};
/* ------------------------------------------------------------------
グラフの背景を描画
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._draw_graph_background = function() {
	var p = this.params;
	var d = p.cpos.r / 3;

	if(p.barShape == "line" || p.barShape == "flat") {
		this._draw_graph_background_back(p.cpos.x0, p.cpos.y0, p.cpos.w, p.cpos.h);
		/* 軸を描画 */
		this._draw_graph_axis(p.cpos.x0, p.cpos.y0, p.cpos.w, p.cpos.h);
	} else {
		/* 背面 */
		this._draw_graph_background_back(p.cpos.x0+d, p.cpos.y0-d, p.cpos.w, p.cpos.h);
		/* 底面 */
		this.ctx.save();
		this.ctx.beginPath();
		this.ctx.moveTo(p.cpos.x0+d, p.cpos.y0-d);
		this.ctx.lineTo(p.cpos.x0+d+p.cpos.w, p.cpos.y0-d);
		this.ctx.lineTo(p.cpos.x0-d+p.cpos.w, p.cpos.y0+d);
		this.ctx.lineTo(p.cpos.x0-d, p.cpos.y0+d);
		this.ctx.closePath();
		this.ctx.fillStyle = p.gBackgroundColor;
		this.ctx.fill();
		this.ctx.restore();
		/* 底面グラデーション（明） */
		this.ctx.save();
		this.ctx.beginPath();
		this.ctx.moveTo(p.cpos.x0+d, p.cpos.y0-d);
		this.ctx.lineTo(p.cpos.x0+d+p.cpos.w, p.cpos.y0-d);
		this.ctx.lineTo(p.cpos.x0-d+p.cpos.w, p.cpos.y0+d);
		this.ctx.lineTo(p.cpos.x0-d, p.cpos.y0+d);
		this.ctx.closePath();
		this.ctx.fillStyle = "rgba(255,255,255,0.3)";
		this.ctx.fill();
		this.ctx.restore();
		/* 側面 */
		this.ctx.save();
		this.ctx.beginPath();
		this.ctx.moveTo(p.cpos.x0+d, p.cpos.y0-d);
		this.ctx.lineTo(p.cpos.x0-d, p.cpos.y0+d);
		this.ctx.lineTo(p.cpos.x0-d, p.cpos.y0+d-p.cpos.h);
		this.ctx.lineTo(p.cpos.x0+d, p.cpos.y0-d-p.cpos.h);
		this.ctx.closePath();
		this.ctx.fillStyle = p.gBackgroundColor;
		this.ctx.fill();
		this.ctx.restore();
		/* 側面補助線 */
		if(p.aLineWidth > 0) {
			this.ctx.save();
			for( var i=0; i<p.aLinePositions.length; i++ ) {
				if(p.aLinePositions[i] > p.yMax) { continue; }
				var aY = p.cpos.y0 -  p.cpos.h * p.aLinePositions[i] / ( p.yMax - p.yMin );
				aY = Math.round(aY);
				//
				this.ctx.beginPath();
				this.ctx.strokeStyle = "rgba(0,0,0," + p.aLineAlpha + ")";
				this.ctx.lineWidth = p.aLineWidth;
				this.ctx.moveTo(p.cpos.x0+d, aY-d-p.aLineWidth/2);
				this.ctx.lineTo(p.cpos.x0-d, aY+d-p.aLineWidth/2);
				this.ctx.stroke();
				//
				this.ctx.beginPath();
				this.ctx.strokeStyle = "rgba(255,255,255," + p.aLineAlpha + ")";
				this.ctx.lineWidth = p.aLineWidth;
				this.ctx.moveTo(p.cpos.x0+d, aY-d+p.aLineWidth/2);
				this.ctx.lineTo(p.cpos.x0-d, aY+d+p.aLineWidth/2);
				this.ctx.stroke();
			}
			this.ctx.restore();
		}
		/* 側面グラデーション（暗） */
		this.ctx.save();
		this.ctx.beginPath();
		this.ctx.moveTo(p.cpos.x0+d, p.cpos.y0-d);
		this.ctx.lineTo(p.cpos.x0-d, p.cpos.y0+d);
		this.ctx.lineTo(p.cpos.x0-d, p.cpos.y0+d-p.cpos.h);
		this.ctx.lineTo(p.cpos.x0+d, p.cpos.y0-d-p.cpos.h);
		this.ctx.closePath();
		this.ctx.fillStyle = "rgba(0,0,0,0.1)";
		this.ctx.fill();
		this.ctx.restore();
		/* 軸を描画 */
		this._draw_graph_axis(p.cpos.x0-d, p.cpos.y0+d, p.cpos.w, p.cpos.h);
	}
};
html5jp.graph.line.prototype._draw_graph_axis = function(x, y, w, h) {
	this.ctx.save();
	var p = this.params;
	/* x軸 */
	this.ctx.beginPath();
	this.ctx.lineWidth = p.xAxisWidth;
	this.ctx.strokeStyle = p.xAxisColor;
	this.ctx.moveTo(x, y);
	this.ctx.lineTo(x+w, y);
	this.ctx.stroke();
	/* y軸 */
	this.ctx.beginPath();
	this.ctx.lineWidth = p.yAxisWidth;
	this.ctx.strokeStyle = p.yAxisColor;
	this.ctx.moveTo(x, y);
	this.ctx.lineTo(x, y-h);
	this.ctx.stroke();
	//
	this.ctx.restore();
};
html5jp.graph.line.prototype._draw_graph_background_back = function(x, y, w, h) {
	var p = this.params;
	/* 背景 */
	this.ctx.save();
	this.ctx.fillStyle = p.gBackgroundColor;
	this.ctx.fillRect(x, y-h, 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();
	this.ctx.fill();
	this.ctx.restore();
	/* グラデーション */
	if( p.gGradation == true) {
		this.ctx.save();
		var grad = this.ctx.createLinearGradient(x, y-h, x+w, y);
		grad.addColorStop(0, "rgba(0, 0, 0, 0.1)");
		grad.addColorStop(0.3, "rgba(255, 255, 255, 0.2)");
		if(document.uniqueID ) { grad.addColorStop(0.5, "rgba(255, 255, 255, 0.2)"); }
		grad.addColorStop(1, "rgba(0, 0, 0, 0.3)");
		this.ctx.fillStyle = grad;
		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();
		if(document.uniqueID ) { this.ctx.globalAlpha = 0.3; }
		this.ctx.fill();
		if(document.uniqueID ) { this.ctx.globalAlpha = 1; }
		this.ctx.restore();
	}
	/* 補助線 */
	if(p.aLineWidth > 0) {
		this.ctx.save();
		for( var i=0; i<p.aLinePositions.length; i++ ) {
//alert("yMax: "+p.yMax+", "+p.aLinePositions[i]);
			if(p.aLinePositions[i] > p.yMax) { continue; }
			var aY = y -  h * p.aLinePositions[i] / ( p.yMax - p.yMin );
			aY = Math.round(aY);
			//
			this.ctx.beginPath();
			this.ctx.strokeStyle = "rgba(0,0,0," + p.aLineAlpha + ")";
			this.ctx.lineWidth = p.aLineWidth;
			this.ctx.moveTo(x, aY-p.aLineWidth/2);
			this.ctx.lineTo(x+w, aY-p.aLineWidth/2);
			this.ctx.stroke();
			//
			this.ctx.beginPath();
			this.ctx.strokeStyle = "rgba(255,255,255," + p.aLineAlpha + ")";
			this.ctx.lineWidth = p.aLineWidth;
			this.ctx.moveTo(x, aY+p.aLineWidth/2);
			this.ctx.lineTo(x+w, aY+p.aLineWidth/2);
			this.ctx.stroke();
		}
		this.ctx.restore();
	}
};
/* ------------------------------------------------------------------
CANVASの背景を塗る
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._draw_canvas_background = function() {
	var c = this._csscolor2rgb(this.params.backgroundColor);
	if( c != null ) {
		this.ctx.save();
		this.ctx.beginPath();
		this.ctx.fillStyle = this.params.backgroundColor;
		this.ctx.fillRect(10, 0, this.canvas.width, this.canvas.height);
		this.ctx.restore();

		this.ctx.beginPath();
		this.ctx.strokeStyle = "rgba(0,0,0,0.8)";
		this.ctx.lineWidth = 1;
		this.ctx.moveTo(10, 0);
		this.ctx.lineTo(10, this.canvas.height);
		this.ctx.lineTo(this.canvas.width, this.canvas.height);
		this.ctx.lineTo(this.canvas.width, 0);
		this.ctx.lineTo(10, 0);
		this.ctx.stroke();

	}
};

/* ------------------------------------------------------------------
文字列を描画
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._drawText = function(x, y, text, font_size, font_family, color) {
	var div = document.createElement('DIV');
	div.appendChild( document.createTextNode(text) );
	div.style.fontSize = font_size;
	div.style.fontFamily = font_family;
	div.style.color = color;
	div.style.margin = "0";
	div.style.padding = "0";
	div.style.position = "absolute";
	div.style.left = x.toString() + "px";
	div.style.top = y.toString() + "px";
	this.canvas.parentNode.appendChild(div);
}
/* ------------------------------------------------------------------
文字列表示領域のサイズを取得
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._getTextBoxSize = function(text, font_size, font_family) {
	var tmpdiv = document.createElement('DIV');
	tmpdiv.appendChild( document.createTextNode(text) );
	tmpdiv.style.fontSize = font_size;
	tmpdiv.style.fontFamily = font_family;
	tmpdiv.style.margin = "0";
	tmpdiv.style.padding = "0";
	tmpdiv.style.visible = "hidden";
	tmpdiv.style.position = "absolute";
	tmpdiv.style.left = "0px";
	tmpdiv.style.top = "0px";
	this.canvas.parentNode.appendChild(tmpdiv);
	var o = {
		w: tmpdiv.offsetWidth,
		h: tmpdiv.offsetHeight
	};
	
	//tf-web 20100409 追加
	//offsetWidth,offsetHeightが取得できない場合があるので 初期値15を挿入
	if(o.w==0) o.w = String(text).length * parseInt(font_size);
	if(o.h==0) o.h = parseInt(font_size);
	
	tmpdiv.parentNode.removeChild(tmpdiv);
	return o;
}

/* ------------------------------------------------------------------
ブラウザー表示領域左上端を基点とする座標系におけるelmの左上端の座標
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._getElementAbsPos = function(elm) {
	var obj = new Object();
	obj.x = elm.offsetLeft;
	obj.y = elm.offsetTop;
	while(elm.offsetParent) {
		elm = elm.offsetParent;
		obj.x += elm.offsetLeft;
		obj.y += elm.offsetTop;
	}
	return obj;
};

/* ------------------------------------------------------------------
* CSS色文字列をRGBに変換
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._csscolor2rgb = function (c) {
	if( ! c ) { return null; }
	var color_map = {
		black: "#000000",
		gray: "#808080",
		silver: "#c0c0c0",
		white: "#ffffff",
		maroon: "#800000",
		red: "#ff0000",
		purple: "#800080",
		fuchsia: "#ff00ff",
		green: "#008000",
		lime: "#00FF00",
		olive: "#808000",
		yellow: "#FFFF00",
		navy: "#000080",
		blue: "#0000FF",
		teal: "#008080",
		aqua: "#00FFFF"
	};
	c = c.toLowerCase();
	var o = new Object();
	if( c.match(/^[a-zA-Z]+$/) && color_map[c] ) {
		c = color_map[c];
	}
	var m = null;
	if( m = c.match(/^\#([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i) ) {
		o.r = parseInt(m[1], 16);
		o.g = parseInt(m[2], 16);
		o.b = parseInt(m[3], 16);
	} else if( m = c.match(/^\#([a-f\d]{1})([a-f\d]{1})([a-f\d]{1})$/i) ) {
		o.r = parseInt(m[1]+"0", 16);
		o.g = parseInt(m[2]+"0", 16);
		o.b = parseInt(m[3]+"0", 16);
	} else if( m = c.match(/^rgba*\(\s*(\d+),\s*(\d+),\s*(\d+)/i) ) {
		o.r = m[1];
		o.g = m[2];
		o.b = m[3];
	} else if( m = c.match(/^rgba*\(\s*(\d+)\%,\s*(\d+)\%,\s*(\d+)\%/i) ) {
		o.r = Math.round(m[1] * 255 / 100);
		o.g = Math.round(m[2] * 255 / 100);
		o.b = Math.round(m[3] * 255 / 100);
	} else {
		return null;
	}
	return o;
};
/* ------------------------------------------------------------------
* 垂直棒フラフ（角柱）を描画
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._draw_vertical_bar_square = function(ctx, x, y, h, xr, yr, color, alpha, balpha, bgradation) {
	if( typeof(alpha) != "number" || alpha < 0 || alpha > 1 ) {
		alpha = 1;
	}
	if( typeof(balpha) != "number" || balpha < 0 || balpha > 1 ) {
		balpha = 1;
	}
	var p = {
		f: {
			tl: { x:x-xr-yr, y:y-h+yr },
			tr: { x:x+xr-yr, y:y-h+yr },
			bl: { x:x-xr-yr, y:y+yr },
			br: { x:x+xr-yr, y:y+yr }
		},
		b: {
			tl: { x:x-xr+yr, y:y-h-yr },
			tr: { x:x+xr+yr, y:y-h-yr },
			bl: { x:x-xr+yr, y:y-yr },
			br: { x:x+xr+yr, y:y-yr }
		}
	}
	/* ------------------------------------------------------
	* 背面の境界線
	* ---------------------------------------------------- */
	ctx.save();
	ctx.strokeStyle = "black";
	ctx.globalAlpha = balpha;
	ctx.lineWidth = 1;
	//
	ctx.beginPath();
	ctx.moveTo(p.f.bl.x, p.f.bl.y);
	ctx.lineTo(p.b.bl.x, p.b.bl.y);
	ctx.lineTo(p.b.br.x, p.b.br.y);
	ctx.stroke();
	//
	ctx.beginPath();
	ctx.moveTo(p.b.bl.x, p.b.bl.y);
	ctx.lineTo(p.b.tl.x, p.b.tl.y);
	ctx.stroke();
	//
	ctx.restore();
	/* ------------------------------------------------------
	* 面塗り
	* ---------------------------------------------------- */
	ctx.save();
	ctx.fillStyle = color;
	ctx.globalAlpha = alpha;
	//
	ctx.beginPath();
	ctx.moveTo(p.f.bl.x, p.f.bl.y);
	ctx.lineTo(p.f.tl.x, p.f.tl.y);
	ctx.lineTo(p.b.tl.x, p.b.tl.y);
	ctx.lineTo(p.b.tr.x, p.b.tr.y);
	ctx.lineTo(p.b.br.x, p.b.br.y);
	ctx.lineTo(p.f.br.x, p.f.br.y);
	ctx.closePath();
	ctx.fill();
	//
	ctx.restore();
	/* ------------------------------------------------------
	* 前面の境界線
	* ---------------------------------------------------- */
	ctx.save();
	ctx.strokeStyle = "white";
	ctx.globalAlpha = balpha;
	ctx.lineWidth = 1;
	//
	ctx.beginPath();
	ctx.moveTo(p.f.bl.x, p.f.bl.y);
	ctx.lineTo(p.f.tl.x, p.f.tl.y);
	ctx.lineTo(p.b.tl.x, p.b.tl.y);
	ctx.lineTo(p.b.tr.x, p.b.tr.y);
	ctx.lineTo(p.b.br.x, p.b.br.y);
	ctx.lineTo(p.f.br.x, p.f.br.y);
	ctx.closePath();
	ctx.stroke();
	//
	ctx.beginPath();
	ctx.moveTo(p.f.tl.x, p.f.tl.y);
	ctx.lineTo(p.f.tr.x, p.f.tr.y);
	ctx.lineTo(p.b.tr.x, p.b.tr.y);
	ctx.stroke();
	//
	ctx.beginPath();
	ctx.moveTo(p.f.tr.x, p.f.tr.y);
	ctx.lineTo(p.f.br.x, p.f.br.y);
	ctx.stroke();
	//
	ctx.restore();
	/* ------------------------------------------------------
	* グラデーション
	* ---------------------------------------------------- */
	if( bgradation == true ) {
		/* 正面 */
		ctx.save();
		var grad = ctx.createLinearGradient(p.f.tl.x, p.f.tl.y, p.f.br.x, p.f.br.y);
		if(document.uniqueID) {
			grad.addColorStop(0, color);
			grad.addColorStop(0.3, "rgba(255, 255, 255, 0.1)");
			grad.addColorStop(1, color);
		} else {
			grad.addColorStop(0, "rgba(0, 0, 0, 0.1)");
			grad.addColorStop(0.3, "rgba(255, 255, 255, 0.1)");
			grad.addColorStop(1, "rgba(0, 0, 0, 0.4)");
		}
		ctx.fillStyle = grad;
		ctx.beginPath();
		ctx.moveTo(p.f.tl.x, p.f.tl.y);
		ctx.lineTo(p.f.tr.x, p.f.tr.y);
		ctx.lineTo(p.f.br.x, p.f.br.y);
		ctx.lineTo(p.f.bl.x, p.f.bl.y);
		ctx.closePath();
		if(document.uniqueID) { ctx.globalAlpha = 0; }
		ctx.fill();
		if(document.uniqueID) { ctx.globalAlpha = 1; }
		ctx.restore();
		/* 右側面 */
		ctx.save();
		if(document.uniqueID ) {
			ctx.fillStyle = "#000000";
			ctx.globalAlpha = 0.4;
		} else {
			var grad3 = ctx.createLinearGradient(p.f.tr.x, p.f.tr.y, p.b.tr.x, p.f.tr.y);
			grad3.addColorStop(0, "rgba(0, 0, 0, 0.3)");
			grad3.addColorStop(1, "rgba(0, 0, 0, 0.5)");
			ctx.fillStyle = grad3;
		}
		ctx.beginPath();
		ctx.moveTo(p.f.tr.x, p.f.tr.y);
		ctx.lineTo(p.b.tr.x, p.b.tr.y);
		ctx.lineTo(p.b.br.x, p.b.br.y);
		ctx.lineTo(p.f.br.x, p.f.br.y);
		ctx.closePath();
		ctx.fill();
		ctx.restore();
		/* 上面 */
		ctx.save();
		var grad2 = ctx.createLinearGradient(x-xr/5, y-h+yr, x+xr/5, y-h-yr);
		if(document.uniqueID) {
			grad2.addColorStop(0, "rgba(255, 255, 255, 0.2)");
			grad2.addColorStop(1, color);
		} else {
			grad2.addColorStop(0, "rgba(255, 255, 255, 0.2)");
			grad2.addColorStop(1, "rgba(0, 0, 0, 0.1)");
		}
		ctx.fillStyle = grad2;
		ctx.beginPath();
		ctx.moveTo(p.f.tl.x, p.f.tl.y);
		ctx.lineTo(p.f.tr.x, p.f.tr.y);
		ctx.lineTo(p.b.tr.x, p.b.tr.y);
		ctx.lineTo(p.b.tl.x, p.b.tl.y);
		ctx.closePath();
		if(document.uniqueID ) { ctx.globalAlpha = 0.1; }
		ctx.fill();
		if(document.uniqueID ) { ctx.globalAlpha = 1; }
		ctx.restore();
	} else {
		/* 側面 */
		ctx.save();
		ctx.fillStyle = "rgba(0,0,0,0.4)";
		ctx.beginPath();
		ctx.moveTo(p.f.tr.x, p.f.tr.y);
		ctx.lineTo(p.b.tr.x, p.b.tr.y);
		ctx.lineTo(p.b.br.x, p.b.br.y);
		ctx.lineTo(p.f.br.x, p.f.br.y);
		ctx.closePath();
		ctx.fill();
		ctx.restore();
		/* 上面 */
		ctx.save();
		ctx.fillStyle = "rgba(255,255,255,0.2)";
		ctx.beginPath();
		ctx.moveTo(p.f.tl.x, p.f.tl.y);
		ctx.lineTo(p.f.tr.x, p.f.tr.y);
		ctx.lineTo(p.b.tr.x, p.b.tr.y);
		ctx.lineTo(p.b.tl.x, p.b.tl.y);
		ctx.closePath();
		ctx.fill();
		ctx.restore();
	}
};
/* ------------------------------------------------------------------
* 垂直棒フラフ（線）を描画
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._draw_vertical_bar_line = function(ctx, x, y, h, xr, color, alpha) {
	if( typeof(alpha) != "number" || alpha < 0 || alpha > 1 ) {
		alpha = 1;
	}
	if( typeof(xr) != "number" || xr <= 0 ) {
		xr = 0.5;
	}
	ctx.save();
	ctx.strokeStyle = color;
	ctx.globalAlpha = alpha;
	ctx.lineCap = "butt";
	ctx.lineWidth = Math.round( xr * 2 );
	ctx.beginPath();
	ctx.moveTo(x, y);
	ctx.lineTo(x, y-h);
	ctx.stroke();
	ctx.restore();
};
/* ------------------------------------------------------------------
* 垂直棒フラフ（平坦）を描画
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._draw_vertical_bar_flat = function(ctx, x, y, h, xr, color, alpha, balpha, bgradation) {
	if( typeof(alpha) != "number" || alpha < 0 || alpha > 1 ) {
		alpha = 1;
	}
	if( typeof(balpha) != "number" || balpha < 0 || balpha > 1 ) {
		balpha = 1;
	}
	/* ------------------------------------------------------
	* 面塗り
	* ---------------------------------------------------- */
	ctx.save();
	ctx.fillStyle = color;
	ctx.globalAlpha = alpha;
	ctx.beginPath();
	ctx.moveTo(x+xr, y);
	ctx.lineTo(x-xr, y);
	ctx.lineTo(x-xr, y-h);
	ctx.lineTo(x+xr, y-h);
	ctx.closePath();
	ctx.fill();
	ctx.restore();
	/* ------------------------------------------------------
	* 境界線
	* ---------------------------------------------------- */
	ctx.save();
	ctx.globalAlpha = balpha;
	ctx.strokeStyle = "black";
	ctx.lineWidth = 1;
	ctx.beginPath();
	ctx.moveTo(x-xr, y);
	ctx.lineTo(x+xr, y);
	ctx.lineTo(x+xr, y-h);
	ctx.lineTo(x-xr, y-h);
	ctx.closePath();
	ctx.stroke();
	ctx.restore();
	/* ------------------------------------------------------
	* シャドー
	* ---------------------------------------------------- */
	ctx.save();
	ctx.lineWidth = 1;
	ctx.globalAlpha = 0.3;
	//
	ctx.beginPath();
	ctx.strokeStyle = "black";
	ctx.moveTo(x-xr+1, y-1);
	ctx.lineTo(x+xr-1, y-1);
	ctx.lineTo(x+xr-1, y-h+1);
	ctx.stroke();
	//
	ctx.beginPath();
	ctx.strokeStyle = "white";
	ctx.moveTo(x+xr-1, y-h+1);
	ctx.lineTo(x-xr+1, y-h+1);
	ctx.lineTo(x-xr+1, y-1);
	ctx.stroke();
	ctx.restore();
	/* ------------------------------------------------------
	* グラデーション
	* ---------------------------------------------------- */
	if( bgradation == true ) {
		ctx.save();
		ctx.lineWidth = 1;
		var grad = ctx.createLinearGradient(x-xr, y-h, x+xr, y);
		if(document.uniqueID ) {
			grad.addColorStop(0, color);
			//grad.addColorStop(0.3, "rgba(255, 255, 255, 0.1)");
			grad.addColorStop(0.8, "rgba(255, 255, 255, 0.1)");
			grad.addColorStop(1, color);
		} else {
			grad.addColorStop(0, "rgba(0, 0, 0, 0.1)");
			//grad.addColorStop(0.3, "rgba(255, 255, 255, 0.1)");
			grad.addColorStop(0.8, "rgba(255, 255, 255, 0.1)");
			grad.addColorStop(1, "rgba(0, 0, 0, 0.4)");
		}
		ctx.fillStyle = grad;
		ctx.beginPath();
		ctx.moveTo(x-xr+2, y-2);
		ctx.lineTo(x+xr-2, y-2);
		ctx.lineTo(x+xr-2, y-h+2);
		ctx.lineTo(x-xr+2, y-h+2);
		ctx.closePath();
		if(document.uniqueID) { ctx.globalAlpha = 0; }
		ctx.fill();
		if(document.uniqueID) { ctx.globalAlpha = 1; }
		ctx.restore();
	}
};
/* ------------------------------------------------------------------
* 垂直棒フラフ（円柱）を描画
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._draw_vertical_bar_cylinder = function(ctx, x, y, h, xr, yr, color, alpha, balpha, bgradation) {
	if( typeof(alpha) != "number" || alpha < 0 || alpha > 1 ) {
		alpha = 1;
	}
	if( typeof(balpha) != "number" || balpha < 0 || balpha > 1 ) {
		balpha = 1;
	}
	/* ------------------------------------------------------
	* 境界線（背面）
	* ---------------------------------------------------- */
	ctx.save();
	ctx.strokeStyle = "black";
	ctx.globalAlpha = balpha;
	ctx.lineWidth = 1;
	ctx.beginPath();
	ctx.moveTo(x-xr, y);
	ctx.bezierCurveTo(x-xr, y-yr/2, x-xr/2, y-yr, x, y-yr);
	ctx.bezierCurveTo(x+xr/2, y-yr, x+xr, y-yr/2, x+xr, y);
	ctx.stroke();
	ctx.restore();
	/* ------------------------------------------------------
	* 面塗り
	* ---------------------------------------------------- */
	ctx.save();
	ctx.fillStyle = color;
	ctx.globalAlpha = alpha;
	ctx.beginPath();
	ctx.moveTo(x-xr, y);
	ctx.lineTo(x-xr, y-h);
	ctx.bezierCurveTo(x-xr, y-h-yr/2, x-xr/2, y-h-yr, x, y-h-yr);
	ctx.bezierCurveTo(x+xr/2, y-h-yr, x+xr, y-h-yr/2, x+xr, y-h);
	ctx.lineTo(x+xr, y);
	ctx.bezierCurveTo(x+xr, y+yr/2, x+xr/2, y+yr, x, y+yr);
	ctx.bezierCurveTo(x-xr/2, y+yr, x-xr, y+yr/2, x-xr, y);
	ctx.fill();
	ctx.restore();
	/* ------------------------------------------------------
	* 境界線（前面）
	* ---------------------------------------------------- */
	ctx.save();
	ctx.strokeStyle = "white";
	ctx.globalAlpha = balpha;
	ctx.lineWidth = 1;
	/* 底面 */
	ctx.beginPath();
	ctx.moveTo(x-xr, y);
	ctx.bezierCurveTo(x-xr, y+yr/2, x-xr/2, y+yr, x, y+yr);
	ctx.bezierCurveTo(x+xr/2, y+yr, x+xr, y+yr/2, x+xr, y);
	ctx.stroke();
	/* 側面 */
	ctx.beginPath();
	ctx.moveTo(x-xr, y);
	ctx.lineTo(x-xr, y-h);
	ctx.stroke();
	ctx.beginPath();
	ctx.moveTo(x+xr, y);
	ctx.lineTo(x+xr, y-h);
	ctx.stroke();
	/* 上面 */
	ctx.beginPath();
	ctx.moveTo(x-xr, y-h);
	ctx.bezierCurveTo(x-xr, y-h-yr/2, x-xr/2, y-h-yr, x, y-h-yr);
	ctx.bezierCurveTo(x+xr/2, y-h-yr, x+xr, y-h-yr/2, x+xr, y-h);
	ctx.bezierCurveTo(x+xr, y-h+yr/2, x+xr/2, y-h+yr, x, y-h+yr);
	ctx.bezierCurveTo(x-xr/2, y-h+yr, x-xr, y-h+yr/2, x-xr, y-h);
	ctx.stroke();
	ctx.restore();
	/* ------------------------------------------------------
	* 前面グラデーション
	* ---------------------------------------------------- */
	if( bgradation == true ) {
		/* 側面 */
		ctx.save();
		var grad1 = ctx.createLinearGradient(x-xr, y, x+xr, y);
		if(document.uniqueID) {
			grad1.addColorStop(0, color);
			grad1.addColorStop(0.4, "rgba(255, 255, 255, 0.3)");
			grad1.addColorStop(0.9, color);
			grad1.addColorStop(1, color);
		} else {
			grad1.addColorStop(0, "rgba(0, 0, 0, 0.1)");
			grad1.addColorStop(0.4, "rgba(255, 255, 255, 0.3)");
			grad1.addColorStop(1, "rgba(0, 0, 0, 0.3)");
		}
		ctx.fillStyle = grad1;
		ctx.beginPath();
		ctx.moveTo(x+xr, y);
		ctx.bezierCurveTo(x+xr, y+yr/2, x+xr/2, y+yr, x, y+yr);
		ctx.bezierCurveTo(x-xr/2, y+yr, x-xr, y+yr/2, x-xr, y);
		ctx.lineTo(x-xr, y-h);
		ctx.bezierCurveTo(x-xr, y-h+yr/2, x-xr/2, y-h+yr, x, y-h+yr);
		ctx.bezierCurveTo(x+xr/2, y-h+yr, x+xr, y-h+yr/2, x+xr, y-h);
		ctx.lineTo(x+xr, y);
		if(document.uniqueID ) { ctx.globalAlpha = 0; }
		ctx.fill();
		if(document.uniqueID ) { ctx.globalAlpha = 1; }
		ctx.restore();
		/* 上面 */
		ctx.save();
		var grad2 = ctx.createLinearGradient(x-xr/5, y-h+yr, x+xr/5, y-h-yr);
		if(document.uniqueID) {
			grad2.addColorStop(0, "rgba(255, 255, 255, 0.2)");
			grad2.addColorStop(1, color);
		} else {
			grad2.addColorStop(0, "rgba(255, 255, 255, 0.2)");
			grad2.addColorStop(1, "rgba(0, 0, 0, 0.1)");
		}
		ctx.fillStyle = grad2;
		ctx.beginPath();
		ctx.moveTo(x-xr, y-h);
		ctx.bezierCurveTo(x-xr, y-h-yr/2, x-xr/2, y-h-yr, x, y-h-yr);
		ctx.bezierCurveTo(x+xr/2, y-h-yr, x+xr, y-h-yr/2, x+xr, y-h);
		ctx.bezierCurveTo(x+xr, y-h+yr/2, x+xr/2, y-h+yr, x, y-h+yr);
		ctx.bezierCurveTo(x-xr/2, y-h+yr, x-xr, y-h+yr/2, x-xr, y-h);
		if(document.uniqueID ) { ctx.globalAlpha = 0; }
		ctx.fill();
		if(document.uniqueID ) { ctx.globalAlpha = 1; }
		ctx.restore();
	} else {
		/* 上面 */
		ctx.save();
		ctx.globalAlpha = 0.2;
		ctx.fillStyle = "white";
		ctx.beginPath();
		ctx.moveTo(x-xr, y-h);
		ctx.bezierCurveTo(x-xr, y-h-yr/2, x-xr/2, y-h-yr, x, y-h-yr);
		ctx.bezierCurveTo(x+xr/2, y-h-yr, x+xr, y-h-yr/2, x+xr, y-h);
		ctx.bezierCurveTo(x+xr, y-h+yr/2, x+xr/2, y-h+yr, x, y-h+yr);
		ctx.bezierCurveTo(x-xr/2, y-h+yr, x-xr, y-h+yr/2, x-xr, y-h);
		ctx.fill();
		ctx.restore();
	}
};
/* ------------------------------------------------------------------
水平補助線を描画
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._draw_h_aline = function(x0, y0, x1, width, type, color) {
	color = this._csscolor2rgb(color);
	this.ctx.beginPath();
	color = "rgb(" + color.r + "," + color.g + "," + color.b + ")"
	this.ctx.strokeStyle = color;
	this.ctx.lineWidth = width;
	if(type == "solid") {
		this.ctx.moveTo(x0, y0);
		this.ctx.lineTo(x1, y0);
		this.ctx.stroke();
	} else if( type == "dashed" || (type == "dotted" && width < 2) ) {
		var x = x0;
		while(1) {
			if(x + width*4 > x1) { break; }
			this.ctx.moveTo(x, y0);
			x = x + width * 4;
			this.ctx.lineTo(x, y0);
			this.ctx.stroke();
			if(x + width*2 > x1) { break; }
			x = x + width*2;
		}
	} else if(type == "dotted") {
		this.ctx.fillStyle = color;
		var x = x0;
		while(1) {
			if(x + width*2 > x1) { break; }
			this.ctx.arc(x, y0, width/2, 0, Math.PI*2, false);
			this.ctx.fill();
			if(x + width*2 > x1) { break; }
			x = x + width*2;
		}
	}
};
/* ------------------------------------------------------------------
折線のドットを描画
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._draw_dot = function(x, y, rad, type, color) {
	this.ctx.beginPath();
	//this.ctx.fillStyle = "rgb(" + color + ")";
	this.ctx.fillStyle = color;
//alert(color);
	if( type == "disc" ) {
		this.ctx.arc(x, y, rad, 0, Math.PI*2, false);
	} else if( type == "square" ) {
		this.ctx.moveTo(x-rad, y-rad);
		this.ctx.lineTo(x+rad, y-rad);
		this.ctx.lineTo(x+rad, y+rad);
		this.ctx.lineTo(x-rad, y+rad);
	} else if( type == "triangle" ) {
		this.ctx.moveTo(x, y-rad);
		this.ctx.lineTo(x+rad, y+rad);
		this.ctx.lineTo(x-rad, y+rad);
	} else if( type == "i-triangle" ) {
		this.ctx.moveTo(x, y+rad);
		this.ctx.lineTo(x+rad, y-rad);
		this.ctx.lineTo(x-rad, y-rad);
	} else if( type == "diamond" ) {
		this.ctx.moveTo(x, y-rad);
		this.ctx.lineTo(x+rad, y);
		this.ctx.lineTo(x, y+rad);
		this.ctx.lineTo(x-rad, y);
	} else {
		this.ctx.arc(x, y, rad, 0, Math.PI*2, false);
	}
	this.ctx.closePath();
	this.ctx.fill();
};
/* ------------------------------------------------------------------
* 垂直棒フラフ（平坦）を描画
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._draw_vertical_bar_background = function(ctx, x, y, h, xr, color, alpha, balpha) {
        if( typeof(alpha) != "number" || alpha < 0 || alpha > 1 ) {
                alpha = 1;
        }
        if( typeof(balpha) != "number" || balpha < 0 || balpha > 1 ) {
                balpha = 1;
        }
//alert("x: "+x+", y: "+y+", h: "+h+", xr: "+xr);
        /* ------------------------------------------------------
        * 面塗り
        * ---------------------------------------------------- */
        ctx.save();
        ctx.fillStyle = color;
        ctx.globalAlpha = alpha;
        ctx.beginPath();
        ctx.moveTo(x+xr, y);
        //ctx.lineTo(100, 110);
        ctx.lineTo(x-xr, y);
        ctx.lineTo(x-xr, y-h);
        ctx.lineTo(x+xr, y-h);
        ctx.closePath();
        ctx.fill();
        ctx.restore();
        /* ------------------------------------------------------
        * 境界線
        * ---------------------------------------------------- */
/*
        ctx.save();
        ctx.globalAlpha = balpha;
        ctx.strokeStyle = "black";
        ctx.lineWidth = 1;
        ctx.beginPath();
        ctx.moveTo(x-xr, y);
        ctx.lineTo(x+xr, y);
        ctx.lineTo(x+xr, y-h);
        ctx.lineTo(x-xr, y-h);
        ctx.closePath();
        ctx.stroke();
        ctx.restore();
*/
}

/* ------------------------------------------------------------------
土、日、祭日の表示
* ---------------------------------------------------------------- */
html5jp.graph.line.prototype._draw_x_scale_background = function(ctx, pos) {
        var p = this.params;
        if( p.xScale == true && p.x.length > 1 ) {
                for(var i=0; i<pos.length; i++) {
                        if(i + 1 > p.x.length - 1) { break; }
                        /* x軸目盛テキスト */
                        var text = p.x[i+1].toString();
                        if(text == "") { continue; }
                        /* x軸目盛テキスト領域のサイズを算出 */
                        var s = this._getTextBoxSize(text, p.xScaleFontSize, p.xScaleFontFamily);
                        /* x軸目盛テキストを描画すべき左上端の座標を算出 */
                        //var x = Math.round( pos[i] - s.w / 2 );
                        var x = Math.round( pos[i] );
			//var y = p.cpos.y0 - sum * cpos.h / params.yMax;
                        /* x軸目盛テキストを描画 */
                        var fcolor = p.xScaleColor;
                        if (p.c[i+1].toString()==0) { /* 日曜日 */
                          fcolor="#FFE9F6";
			  this._draw_vertical_bar_background(ctx, x, p.cpos.y0-1, p.cpos.h-1, p.cpos.r+2.5, fcolor, p.barAlpha, p.borderAlpha);
                        } else if (p.c[i+1].toString()==6) { /* 土曜日 */
                          fcolor="#DCF0FF";
			  this._draw_vertical_bar_background(ctx, x, p.cpos.y0-1, p.cpos.h-1, p.cpos.r+2.5, fcolor, p.barAlpha, p.borderAlpha);
                        } else if (p.c[i+1].toString()==7) { /* 祭日 */
                          fcolor="#FFE2DC";
			  this._draw_vertical_bar_background(ctx, x, p.cpos.y0-1, p.cpos.h-1, p.cpos.r+2.5, fcolor, p.barAlpha, p.borderAlpha);
                        } else if (p.c[i+1].toString()==8) { /* 徹夜 */
                          fcolor="#DDDDDD";
			  this._draw_vertical_bar_background(ctx, x, p.cpos.y0-1, p.cpos.h-1, p.cpos.r+2.5, fcolor, p.barAlpha, p.borderAlpha);
                        }
                }
        }
};

/* ------------------------------------------------------------------
目標線を描画 (2008/05/02)
* ---------------------------------------------------------------- */

html5jp.graph.line.prototype._draw_target_line = function(ltype, lwidth, lcolor, lvalue) {
        var p = this.params;
        var x = p.cpos.x0;
        var y = p.cpos.y0;
        var w = p.cpos.w;
        var h = p.cpos.h;
        var x1 = p.cpos.x1;
        var width = p.xAxisWidth;
        var horizon_val = p.horizon_val;
	lvalue = lvalue + 24 - horizon_val;

        if(lwidth > 0 && lvalue > 0) {

                if(ltype == 1){
                        //実線描画
                        this.ctx.save();
                        var aY = y - h * lvalue / ( p.yMax - p.yMin );
                        aY = Math.round(aY);
                        //
                        this.ctx.beginPath();
                        this.ctx.strokeStyle = lcolor;
                        this.ctx.lineWidth = lwidth;
                        this.ctx.moveTo(x, aY-lwidth/2);
                        this.ctx.lineTo(x+w, aY-lwidth/2);
                        this.ctx.stroke();
                        //
                        //this.ctx.restore();
                } else if (ltype == 2){

                        //破線描画
                        this.ctx.save();
                        this.ctx.beginPath();
                        var xx = x;
                        var aY = y - h * lvalue / ( p.yMax - p.yMin );
                        aY = Math.round(aY);
                        this.ctx.strokeStyle = lcolor;
                        this.ctx.lineWidth = lwidth;

                        while(1) {
                                if(x + width*4 > x1) { break; }
                                this.ctx.moveTo(x, aY-lwidth/2);
                                x = x + width * 4;
                                this.ctx.lineTo(x, aY-lwidth/2);
                                this.ctx.stroke();
                                if(x + width*2 > x1) { break; }
                                x = x + width*2;
                        }
                        //this.ctx.restore();
                }
        }
}

html5jp.graph.line.prototype._draw_target_label = function(ltype, lwidth, lcolor, x, aY, w, title) {
        var p = this.params;
        var y = p.cpos.y0;
        var h = p.cpos.h;
        var x1 = x+w;
        var width = p.xAxisWidth;

        if(lwidth > 0) {

                if(ltype == 1){
                        //実線描画
                        this.ctx.save();
                        aY = Math.round(aY);
                        //
                        this.ctx.beginPath();
                        this.ctx.strokeStyle = lcolor;
                        this.ctx.lineWidth = lwidth;
                        this.ctx.moveTo(x, aY-lwidth/2);
                        this.ctx.lineTo(x+w, aY-lwidth/2);
                        this.ctx.stroke();
                        //
                        //this.ctx.restore();
                } else if (ltype == 2){

                        //破線描画
                        this.ctx.save();
                        this.ctx.beginPath();
                        var xx = x;
                        aY = Math.round(aY);
                        this.ctx.strokeStyle = lcolor;
                        this.ctx.lineWidth = lwidth;

                        while(1) {
                                if(x + width*4 > x1) { break; }
                                this.ctx.moveTo(x, aY-lwidth/2);
                                x = x + width * 4;
                                this.ctx.lineTo(x, aY-lwidth/2);
                                this.ctx.stroke();
                                if(x + width*2 > x1) { break; }
                                x = x + width*2;
                        }
                        //this.ctx.restore();
                }
		this._drawText(x1+3, aY-7, title, p.xCaptionFontSize, p.xCaptionFontFamily, p.xCaptionColor);
        }
}