svg.js

来自「Hippo CMS是一个以信息为中心的开源内容管理系统。Hippo CMS目标是」· JavaScript 代码 · 共 474 行 · 第 1/2 页

	var strokeStyle = dojo.lang.shallowCopy(dojo.gfx.defaultStroke, true);
	var color = new dojo.gfx.color.Color(stroke);
	if (color) {
		strokeStyle.color = color;
		strokeStyle.color.a = rawNode.getAttribute("stroke-opacity");
		strokeStyle.width = rawNode.getAttribute("stroke-width");
		strokeStyle.cap = rawNode.getAttribute("stroke-linecap");
		strokeStyle.join = rawNode.getAttribute("stroke-linejoin");
		if (strokeStyle.join == "miter") {
			strokeStyle.join = rawNode.getAttribute("stroke-miterlimit");
		}
	}
	return strokeStyle;
}, attachTransform:function (rawNode) {
	var matrix = null;
	if (rawNode) {
		matrix = rawNode.getAttribute("transform");
		if (matrix.match(/^matrix\(.+\)$/)) {
			var t = matrix.slice(7, -1).split(",");
			matrix = dojo.gfx.matrix.normalize({xx:parseFloat(t[0]), xy:parseFloat(t[2]), yx:parseFloat(t[1]), yy:parseFloat(t[3]), dx:parseFloat(t[4]), dy:parseFloat(t[5])});
		}
	}
	return matrix;
}, attachShape:function (rawNode) {
	var shape = null;
	if (rawNode) {
		shape = dojo.lang.shallowCopy(this.shape, true);
		for (var i in shape) {
			shape[i] = rawNode.getAttribute(i);
		}
	}
	return shape;
}, attach:function (rawNode) {
	if (rawNode) {
		this.rawNode = rawNode;
		this.fillStyle = this.attachFill(rawNode);
		this.strokeStyle = this.attachStroke(rawNode);
		this.matrix = this.attachTransform(rawNode);
		this.shape = this.attachShape(rawNode);
	}
}});
dojo.declare("dojo.gfx.Group", dojo.gfx.Shape, {setRawNode:function (rawNode) {
	this.rawNode = rawNode;
}});
dojo.gfx.Group.nodeType = "g";
dojo.declare("dojo.gfx.Rect", dojo.gfx.shape.Rect, {attachShape:function (rawNode) {
	var shape = null;
	if (rawNode) {
		shape = dojo.gfx.Rect.superclass.attachShape.apply(this, arguments);
		shape.r = Math.min(rawNode.getAttribute("rx"), rawNode.getAttribute("ry"));
	}
	return shape;
}, setShape:function (newShape) {
	this.shape = dojo.gfx.makeParameters(this.shape, newShape);
	this.bbox = null;
	for (var i in this.shape) {
		if (i != "type" && i != "r") {
			this.rawNode.setAttribute(i, this.shape[i]);
		}
	}
	this.rawNode.setAttribute("rx", this.shape.r);
	this.rawNode.setAttribute("ry", this.shape.r);
	return this;
}});
dojo.gfx.Rect.nodeType = "rect";
dojo.gfx.Ellipse = dojo.gfx.shape.Ellipse;
dojo.gfx.Ellipse.nodeType = "ellipse";
dojo.gfx.Circle = dojo.gfx.shape.Circle;
dojo.gfx.Circle.nodeType = "circle";
dojo.gfx.Line = dojo.gfx.shape.Line;
dojo.gfx.Line.nodeType = "line";
dojo.declare("dojo.gfx.Polyline", dojo.gfx.shape.Polyline, {setShape:function (points) {
	if (points && points instanceof Array) {
		this.shape = dojo.gfx.makeParameters(this.shape, {points:points});
		if (closed && this.shape.points.length) {
			this.shape.points.push(this.shape.points[0]);
		}
	} else {
		this.shape = dojo.gfx.makeParameters(this.shape, points);
	}
	this.box = null;
	var attr = [];
	var p = this.shape.points;
	for (var i = 0; i < p.length; ++i) {
		attr.push(p[i].x.toFixed(8));
		attr.push(p[i].y.toFixed(8));
	}
	this.rawNode.setAttribute("points", attr.join(" "));
	return this;
}});
dojo.gfx.Polyline.nodeType = "polyline";
dojo.declare("dojo.gfx.Image", dojo.gfx.shape.Image, {setShape:function (newShape) {
	this.shape = dojo.gfx.makeParameters(this.shape, newShape);
	this.bbox = null;
	var rawNode = this.rawNode;
	for (var i in this.shape) {
		if (i != "type" && i != "src") {
			rawNode.setAttribute(i, this.shape[i]);
		}
	}
	rawNode.setAttributeNS(dojo.svg.xmlns.xlink, "href", this.shape.src);
	return this;
}, setStroke:function () {
	return this;
}, setFill:function () {
	return this;
}, attachStroke:function (rawNode) {
	return null;
}, attachFill:function (rawNode) {
	return null;
}});
dojo.gfx.Image.nodeType = "image";
dojo.declare("dojo.gfx.Path", dojo.gfx.path.Path, {_updateWithSegment:function (segment) {
	dojo.gfx.Path.superclass._updateWithSegment.apply(this, arguments);
	if (typeof (this.shape.path) == "string") {
		this.rawNode.setAttribute("d", this.shape.path);
	}
}, setShape:function (newShape) {
	dojo.gfx.Path.superclass.setShape.apply(this, arguments);
	this.rawNode.setAttribute("d", this.shape.path);
	return this;
}});
dojo.gfx.Path.nodeType = "path";
dojo.gfx._creators = {createPath:function (path) {
	return this.createObject(dojo.gfx.Path, path);
}, createRect:function (rect) {
	return this.createObject(dojo.gfx.Rect, rect);
}, createCircle:function (circle) {
	return this.createObject(dojo.gfx.Circle, circle);
}, createEllipse:function (ellipse) {
	return this.createObject(dojo.gfx.Ellipse, ellipse);
}, createLine:function (line) {
	return this.createObject(dojo.gfx.Line, line);
}, createPolyline:function (points) {
	return this.createObject(dojo.gfx.Polyline, points);
}, createImage:function (image) {
	return this.createObject(dojo.gfx.Image, image);
}, createGroup:function () {
	return this.createObject(dojo.gfx.Group);
}, createObject:function (shapeType, rawShape) {
	if (!this.rawNode) {
		return null;
	}
	var shape = new shapeType();
	var node = document.createElementNS(dojo.svg.xmlns.svg, shapeType.nodeType);
	shape.setRawNode(node);
	this.rawNode.appendChild(node);
	shape.setShape(rawShape);
	this.add(shape);
	return shape;
}, add:function (shape) {
	var oldParent = shape.getParent();
	if (oldParent) {
		oldParent.remove(shape, true);
	}
	shape._setParent(this, null);
	this.rawNode.appendChild(shape.rawNode);
	return this;
}, remove:function (shape, silently) {
	if (this.rawNode == shape.rawNode.parentNode) {
		this.rawNode.removeChild(shape.rawNode);
	}
	shape._setParent(null, null);
	return this;
}};
dojo.gfx.attachNode = function (node) {
	if (!node) {
		return null;
	}
	var s = null;
	switch (node.tagName.toLowerCase()) {
	  case dojo.gfx.Rect.nodeType:
		s = new dojo.gfx.Rect();
		break;
	  case dojo.gfx.Ellipse.nodeType:
		s = new dojo.gfx.Ellipse();
		break;
	  case dojo.gfx.Polyline.nodeType:
		s = new dojo.gfx.Polyline();
		break;
	  case dojo.gfx.Path.nodeType:
		s = new dojo.gfx.Path();
		break;
	  case dojo.gfx.Circle.nodeType:
		s = new dojo.gfx.Circle();
		break;
	  case dojo.gfx.Line.nodeType:
		s = new dojo.gfx.Line();
		break;
	  case dojo.gfx.Image.nodeType:
		s = new dojo.gfx.Image();
		break;
	  default:
		dojo.debug("FATAL ERROR! tagName = " + node.tagName);
	}
	s.attach(node);
	return s;
};
dojo.lang.extend(dojo.gfx.Surface, {setDimensions:function (width, height) {
	if (!this.rawNode) {
		return this;
	}
	this.rawNode.setAttribute("width", width);
	this.rawNode.setAttribute("height", height);
	return this;
}, getDimensions:function () {
	return this.rawNode ? {width:this.rawNode.getAttribute("width"), height:this.rawNode.getAttribute("height")} : null;
}});
dojo.gfx.createSurface = function (parentNode, width, height) {
	var s = new dojo.gfx.Surface();
	s.rawNode = document.createElementNS(dojo.svg.xmlns.svg, "svg");
	s.rawNode.setAttribute("width", width);
	s.rawNode.setAttribute("height", height);
	var defs = new dojo.gfx.svg.Defines();
	var node = document.createElementNS(dojo.svg.xmlns.svg, dojo.gfx.svg.Defines.nodeType);
	defs.setRawNode(node);
	s.rawNode.appendChild(node);
	dojo.byId(parentNode).appendChild(s.rawNode);
	return s;
};
dojo.gfx.attachSurface = function (node) {
	var s = new dojo.gfx.Surface();
	s.rawNode = node;
	return s;
};
dojo.lang.extend(dojo.gfx.Group, dojo.gfx._creators);
dojo.lang.extend(dojo.gfx.Surface, dojo.gfx._creators);
delete dojo.gfx._creators;
dojo.gfx.svg.Defines = function () {
	this.rawNode = null;
};
dojo.lang.extend(dojo.gfx.svg.Defines, {setRawNode:function (rawNode) {
	this.rawNode = rawNode;
}});
dojo.gfx.svg.Defines.nodeType = "defs";