plotters.js

初学者

		for (var i = 0; i < data.length; i++) {
			var x = plot.axisX.getCoord(data[i].x, plotarea, plot);
			var y = plot.axisY.getCoord(data[i].y, plotarea, plot);
			if (i == 0) {
				cmd.push("M");
			} else {
				cmd.push("L");
			}
			cmd.push(x + "," + y);
			var c = document.createElementNS(dojo.svg.xmlns.svg, "circle");
			c.setAttribute("cx", x);
			c.setAttribute("cy", y);
			c.setAttribute("r", "3");
			c.setAttribute("fill", data[i].series.color);
			c.setAttribute("fill-opacity", "0.6");
			c.setAttribute("stroke-width", "1");
			c.setAttribute("stroke-opacity", "0.85");
			line.appendChild(c);
			if (applyTo) {
				applyTo(c, data[i].src);
			}
		}
		path.setAttribute("d", cmd.join(" "));
		return line;
	}, CurvedLine:function (data, plotarea, plot, applyTo) {
		var tension = 3;
		var area = plotarea.getArea();
		var line = document.createElementNS(dojo.svg.xmlns.svg, "g");
		if (data.length == 0) {
			return line;
		}
		var path = document.createElementNS(dojo.svg.xmlns.svg, "path");
		line.appendChild(path);
		path.setAttribute("fill", "none");
		path.setAttribute("stroke", data[0].series.color);
		path.setAttribute("stroke-width", "2");
		path.setAttribute("stroke-opacity", "0.85");
		if (data[0].series.label != null) {
			path.setAttribute("title", data[0].series.label);
		}
		var cmd = [];
		for (var i = 0; i < data.length; i++) {
			var x = plot.axisX.getCoord(data[i].x, plotarea, plot);
			var y = plot.axisY.getCoord(data[i].y, plotarea, plot);
			var dx = area.left + 1;
			var dy = area.bottom;
			if (i > 0) {
				dx = x - plot.axisX.getCoord(data[i - 1].x, plotarea, plot);
				dy = plot.axisY.getCoord(data[i - 1].y, plotarea, plot);
			}
			if (i == 0) {
				cmd.push("M");
			} else {
				cmd.push("C");
				var cx = x - (tension - 1) * (dx / tension);
				cmd.push(cx + "," + dy);
				cx = x - (dx / tension);
				cmd.push(cx + "," + y);
			}
			cmd.push(x + "," + y);
			var c = document.createElementNS(dojo.svg.xmlns.svg, "circle");
			c.setAttribute("cx", x);
			c.setAttribute("cy", y);
			c.setAttribute("r", "3");
			c.setAttribute("fill", data[i].series.color);
			c.setAttribute("fill-opacity", "0.6");
			c.setAttribute("stroke-width", "1");
			c.setAttribute("stroke-opacity", "0.85");
			line.appendChild(c);
			if (applyTo) {
				applyTo(c, data[i].src);
			}
		}
		path.setAttribute("d", cmd.join(" "));
		return line;
	}, Area:function (data, plotarea, plot, applyTo) {
		var area = plotarea.getArea();
		var line = document.createElementNS(dojo.svg.xmlns.svg, "g");
		if (data.length == 0) {
			return line;
		}
		var path = document.createElementNS(dojo.svg.xmlns.svg, "path");
		line.appendChild(path);
		path.setAttribute("fill", data[0].series.color);
		path.setAttribute("fill-opacity", "0.4");
		path.setAttribute("stroke", data[0].series.color);
		path.setAttribute("stroke-width", "1");
		path.setAttribute("stroke-opacity", "0.85");
		if (data[0].series.label != null) {
			path.setAttribute("title", data[0].series.label);
		}
		var cmd = [];
		for (var i = 0; i < data.length; i++) {
			var x = plot.axisX.getCoord(data[i].x, plotarea, plot);
			var y = plot.axisY.getCoord(data[i].y, plotarea, plot);
			if (i == 0) {
				cmd.push("M");
			} else {
				cmd.push("L");
			}
			cmd.push(x + "," + y);
			var c = document.createElementNS(dojo.svg.xmlns.svg, "circle");
			c.setAttribute("cx", x);
			c.setAttribute("cy", y);
			c.setAttribute("r", "3");
			c.setAttribute("fill", data[i].series.color);
			c.setAttribute("fill-opacity", "0.6");
			c.setAttribute("stroke-width", "1");
			c.setAttribute("stroke-opacity", "0.85");
			line.appendChild(c);
			if (applyTo) {
				applyTo(c, data[i].src);
			}
		}
		cmd.push("L");
		cmd.push(x + "," + plot.axisY.getCoord(plot.axisX.origin, plotarea, plot));
		cmd.push("L");
		cmd.push(plot.axisX.getCoord(data[0].x, plotarea, plot) + "," + plot.axisY.getCoord(plot.axisX.origin, plotarea, plot));
		cmd.push("Z");
		path.setAttribute("d", cmd.join(" "));
		return line;
	}, CurvedArea:function (data, plotarea, plot, applyTo) {
		var tension = 3;
		var area = plotarea.getArea();
		var line = document.createElementNS(dojo.svg.xmlns.svg, "g");
		if (data.length == 0) {
			return line;
		}
		var path = document.createElementNS(dojo.svg.xmlns.svg, "path");
		line.appendChild(path);
		path.setAttribute("fill", data[0].series.color);
		path.setAttribute("fill-opacity", "0.4");
		path.setAttribute("stroke", data[0].series.color);
		path.setAttribute("stroke-width", "1");
		path.setAttribute("stroke-opacity", "0.85");
		if (data[0].series.label != null) {
			path.setAttribute("title", data[0].series.label);
		}
		var cmd = [];
		for (var i = 0; i < data.length; i++) {
			var x = plot.axisX.getCoord(data[i].x, plotarea, plot);
			var y = plot.axisY.getCoord(data[i].y, plotarea, plot);
			var dx = area.left + 1;
			var dy = area.bottom;
			if (i > 0) {
				dx = x - plot.axisX.getCoord(data[i - 1].x, plotarea, plot);
				dy = plot.axisY.getCoord(data[i - 1].y, plotarea, plot);
			}
			if (i == 0) {
				cmd.push("M");
			} else {
				cmd.push("C");
				var cx = x - (tension - 1) * (dx / tension);
				cmd.push(cx + "," + dy);
				cx = x - (dx / tension);
				cmd.push(cx + "," + y);
			}
			cmd.push(x + "," + y);
			var c = document.createElementNS(dojo.svg.xmlns.svg, "circle");
			c.setAttribute("cx", x);
			c.setAttribute("cy", y);
			c.setAttribute("r", "3");
			c.setAttribute("fill", data[i].series.color);
			c.setAttribute("fill-opacity", "0.6");
			c.setAttribute("stroke-width", "1");
			c.setAttribute("stroke-opacity", "0.85");
			line.appendChild(c);
			if (applyTo) {
				applyTo(c, data[i].src);
			}
		}
		cmd.push("L");
		cmd.push(x + "," + plot.axisY.getCoord(plot.axisX.origin, plotarea, plot));
		cmd.push("L");
		cmd.push(plot.axisX.getCoord(data[0].x, plotarea, plot) + "," + plot.axisY.getCoord(plot.axisX.origin, plotarea, plot));
		cmd.push("Z");
		path.setAttribute("d", cmd.join(" "));
		return line;
	}, HighLow:function (data, plotarea, plot, applyTo) {
		var area = plotarea.getArea();
		var group = document.createElementNS(dojo.svg.xmlns.svg, "g");
		var n = data.length;
		var part = ((area.right - area.left) / (plot.axisX.range.upper - plot.axisX.range.lower)) / 4;
		var w = part * 2;
		for (var i = 0; i < n; i++) {
			var high = data[i].high;
			var low = data[i].low;
			if (low > high) {
				var t = low;
				low = high;
				high = t;
			}
			var x = plot.axisX.getCoord(data[i].x, plotarea, plot) - (w / 2);
			var y = plot.axisY.getCoord(high, plotarea, plot);
			var h = plot.axisY.getCoord(low, plotarea, plot) - y;
			var bar = document.createElementNS(dojo.svg.xmlns.svg, "rect");
			bar.setAttribute("fill", data[i].series.color);
			bar.setAttribute("stroke-width", "0");
			bar.setAttribute("x", x);
			bar.setAttribute("y", y);
			bar.setAttribute("width", w);
			bar.setAttribute("height", h);
			bar.setAttribute("fill-opacity", "0.6");
			if (applyTo) {
				applyTo(bar, data[i].src);
			}
			group.appendChild(bar);
		}
		return group;
	}, HighLowClose:function (data, plotarea, plot, applyTo) {
		var area = plotarea.getArea();
		var group = document.createElementNS(dojo.svg.xmlns.svg, "g");
		var n = data.length;
		var part = ((area.right - area.left) / (plot.axisX.range.upper - plot.axisX.range.lower)) / 4;
		var w = part * 2;
		for (var i = 0; i < n; i++) {
			var high = data[i].high;
			var low = data[i].low;
			if (low > high) {
				var t = low;
				low = high;
				high = t;
			}
			var c = data[i].close;
			var x = plot.axisX.getCoord(data[i].x, plotarea, plot) - (w / 2);
			var y = plot.axisY.getCoord(high, plotarea, plot);
			var h = plot.axisY.getCoord(low, plotarea, plot) - y;
			var close = plot.axisY.getCoord(c, plotarea, plot);
			var g = document.createElementNS(dojo.svg.xmlns.svg, "g");
			var bar = document.createElementNS(dojo.svg.xmlns.svg, "rect");
			bar.setAttribute("fill", data[i].series.color);
			bar.setAttribute("stroke-width", "0");
			bar.setAttribute("x", x);
			bar.setAttribute("y", y);
			bar.setAttribute("width", w);
			bar.setAttribute("height", h);
			bar.setAttribute("fill-opacity", "0.6");
			g.appendChild(bar);
			var line = document.createElementNS(dojo.svg.xmlns.svg, "line");
			line.setAttribute("x1", x);
			line.setAttribute("x2", x + w + (part * 2));
			line.setAttribute("y1", close);
			line.setAttribute("y2", close);
			line.setAttribute("style", "stroke:" + data[i].series.color + ";stroke-width:1px;stroke-opacity:0.6;");
			g.appendChild(line);
			if (applyTo) {
				applyTo(g, data[i].src);
			}
			group.appendChild(g);
		}
		return group;
	}, HighLowOpenClose:function (data, plotarea, plot, applyTo) {
		var area = plotarea.getArea();
		var group = document.createElementNS(dojo.svg.xmlns.svg, "g");
		var n = data.length;
		var part = ((area.right - area.left) / (plot.axisX.range.upper - plot.axisX.range.lower)) / 4;
		var w = part * 2;
		for (var i = 0; i < n; i++) {
			var high = data[i].high;
			var low = data[i].low;
			if (low > high) {
				var t = low;
				low = high;
				high = t;
			}
			var o = data[i].open;
			var c = data[i].close;
			var x = plot.axisX.getCoord(data[i].x, plotarea, plot) - (w / 2);
			var y = plot.axisY.getCoord(high, plotarea, plot);
			var h = plot.axisY.getCoord(low, plotarea, plot) - y;
			var open = plot.axisY.getCoord(o, plotarea, plot);
			var close = plot.axisY.getCoord(c, plotarea, plot);
			var g = document.createElementNS(dojo.svg.xmlns.svg, "g");
			var bar = document.createElementNS(dojo.svg.xmlns.svg, "rect");
			bar.setAttribute("fill", data[i].series.color);
			bar.setAttribute("stroke-width", "0");
			bar.setAttribute("x", x);
			bar.setAttribute("y", y);
			bar.setAttribute("width", w);
			bar.setAttribute("height", h);
			bar.setAttribute("fill-opacity", "0.6");
			g.appendChild(bar);
			var line = document.createElementNS(dojo.svg.xmlns.svg, "line");
			line.setAttribute("x1", x - (part * 2));
			line.setAttribute("x2", x + w);
			line.setAttribute("y1", open);
			line.setAttribute("y2", open);
			line.setAttribute("style", "stroke:" + data[i].series.color + ";stroke-width:1px;stroke-opacity:0.6;");
			g.appendChild(line);
			var line = document.createElementNS(dojo.svg.xmlns.svg, "line");
			line.setAttribute("x1", x);
			line.setAttribute("x2", x + w + (part * 2));
			line.setAttribute("y1", close);
			line.setAttribute("y2", close);
			line.setAttribute("style", "stroke:" + data[i].series.color + ";stroke-width:1px;stroke-opacity:0.6;");
			g.appendChild(line);
			if (applyTo) {
				applyTo(g, data[i].src);
			}
			group.appendChild(g);
		}
		return group;
	}, Scatter:function (data, plotarea, plot, applyTo) {
		var r = 7;
		var group = document.createElementNS(dojo.svg.xmlns.svg, "g");
		for (var i = 0; i < data.length; i++) {
			var x = plot.axisX.getCoord(data[i].x, plotarea, plot);
			var y = plot.axisY.getCoord(data[i].y, plotarea, plot);
			var point = document.createElementNS(dojo.svg.xmlns.svg, "path");
			point.setAttribute("fill", data[i].series.color);
			point.setAttribute("stroke-width", "0");
			point.setAttribute("d", "M " + x + "," + (y - r) + " " + "Q " + x + "," + y + " " + (x + r) + "," + y + " " + "Q " + x + "," + y + " " + x + "," + (y + r) + " " + "Q " + x + "," + y + " " + (x - r) + "," + y + " " + "Q " + x + "," + y + " " + x + "," + (y - r) + " " + "Z");
			if (applyTo) {
				applyTo(point, data[i].src);
			}
			group.appendChild(point);
		}
		return group;
	}, Bubble:function (data, plotarea, plot, applyTo) {
		var group = document.createElementNS(dojo.svg.xmlns.svg, "g");
		var sizeFactor = 1;
		for (var i = 0; i < data.length; i++) {
			var x = plot.axisX.getCoord(data[i].x, plotarea, plot);
			var y = plot.axisY.getCoord(data[i].y, plotarea, plot);
			if (i == 0) {
				var raw = data[i].size;
				var dy = plot.axisY.getCoord(data[i].y + raw, plotarea, plot) - y;
				sizeFactor = dy / raw;
			}
			if (sizeFactor < 1) {
				sizeFactor = 1;
			}
			var point = document.createElementNS(dojo.svg.xmlns.svg, "circle");
			point.setAttribute("fill", data[i].series.color);
			point.setAttribute("fill-opacity", "0.8");
			point.setAttribute("stroke", data[i].series.color);
			point.setAttribute("stroke-width", "1");
			point.setAttribute("cx", x);
			point.setAttribute("cy", y);
			point.setAttribute("r", (data[i].size / 2) * sizeFactor);
			if (applyTo) {
				applyTo(point, data[i].src);
			}
			group.appendChild(point);
		}
		return group;
	}});
	dojo.charting.Plotters["Default"] = dojo.charting.Plotters.Line;
}