svnno****@sourc*****
svnno****@sourc*****
2010年 4月 5日 (月) 00:12:46 JST
Revision: 1778 http://sourceforge.jp/projects/sie/svn/view?view=rev&revision=1778 Author: dhrname Date: 2010-04-05 00:12:46 +0900 (Mon, 05 Apr 2010) Log Message: ----------- SVGLinearGradientElementオブジェクトの実装 Modified Paths: -------------- branches/ufltima/dom/svg.js Modified: branches/ufltima/dom/svg.js =================================================================== --- branches/ufltima/dom/svg.js 2010-04-03 15:17:48 UTC (rev 1777) +++ branches/ufltima/dom/svg.js 2010-04-04 15:12:46 UTC (rev 1778) @@ -1161,7 +1161,7 @@ var obje = document.getElementsByTagName("object"); for (var i=0, objli=1;i<objli;++i) { var objei = {style:{}};//obje[i]; - xmlhttp.open("GET", "4wd.svg", true);//objei.getAttribute("data"), true); + xmlhttp.open("GET", "tiger.svg", true);//objei.getAttribute("data"), true); xmlhttp.setRequestHeader("X-Requested-With", "XMLHttpRequest"); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState === 4 && xmlhttp.status === 200) { @@ -1711,7 +1711,7 @@ var tnl = tar.normalizedPathSegList, tlist = tar.pathSegList, D = [], _parseFloat = parseFloat; /*d属性の値を正規表現を用いて、二次元配列Dに変換している。もし、d属性の値が"M 20 30 L20 40"ならば、 *JSONにおける表現は以下のとおり - *D = s[["M", 20, 30], ["L", 20 40]] + *D = [["M", 20, 30], ["L", 20 40]] */ var dd = evt.newValue .replace(/\-/g, " -") @@ -1972,7 +1972,7 @@ dat += "l"; } else if (tps === "C") { dat += "c"; - /*CTM(maなど)の行列と座標(x, y)の積を算出する。数学における表現は以下のとおり + /*CTM(mx)の行列と座標(x, y)の積を算出する。数学における表現は以下のとおり *[ma mc me] [x] *[mb md mf] * [y] *[0 0 1 ] [1] @@ -2009,18 +2009,17 @@ var el = tar._tar, fill = style.getPropertyCSSValue("fill"), stroke = style.getPropertyCSSValue("stroke"); if (fill.paintType === SVGPaint.SVG_PAINTTYPE_RGBCOLOR || fill.paintType === SVGPaint.SVG_PAINTTYPE_CURRENTCOLOR) { var fillElement = !!tar._fillElement ? tar._fillElement : document.createElement("v:fill"); - var isRadial = false; var fc = fill.rgbColor, num = CSSPrimitiveValue.CSS_NUMBER; fillElement.setAttribute("color", "rgb(" +fc.red.getFloatValue(num)+ "," +fc.green.getFloatValue(num)+ "," +fc.blue.getFloatValue(num)+ ")"); var fillOpacity = parseFloat(style.getPropertyValue("fill-opacity")) * parseFloat(style.getPropertyValue("opacity")); //opacityを掛け合わせる if (fillOpacity < 1) { fillElement.setAttribute("opacity", fillOpacity+""); } - if (!isRadial && !!!tar._fillElement) { + if (!!!tar._fillElement) { el.appendChild(fillElement); tar._fillElement = fillElement; //キャッシュを作る } - fc = isRadial = fillOpacity = null; + fc = fillOpacity = null; } else if (fill.uri) { /*以下では、Gradation関連の要素に、イベントを渡すことで、 *この要素の、グラデーション描画を行う @@ -2032,6 +2031,10 @@ evtt._tar = !!tar._fillElement ? tar._fillElement : document.createElement("v:fill"); evtt._style = style; t.dispatchEvent(evtt); + if (t.localName !== "radialGradient" && !!!tar._fillElement) { + el.appendChild(evtt._tar); + tar._fillElement = evtt._tar; //キャッシュを作る + } t = evtt = null; } } else { @@ -2619,7 +2622,7 @@ grad2.getAttributeNS("http://www.w3.org/1999/xlink", "href").match(/#(.+)/); grad2 = evt.target.ownerDocument.getElementById(RegExp.$1); } - var stops = grad2.getElementsByTagNameNS("http://www.w3.org/svg/2000", "stop"); + var stops = grad2.getElementsByTagNameNS("http://www.w3.org/2000/svg", "stop"); if (!stops) { grad = grad2 = stops = null; return; @@ -2629,8 +2632,8 @@ for (var i = 0; i < length; ++i) { var stop = stops[i]; color[i] = stop.style.getPropertyValue("stop-color"); - colors[i] = stop.offset + " " + color[i]; - opacity[i] = (parseFloat(stop.style.getPropertyVlaue("stop-opacity")) || 1) * parseFloat(t.getPropertyValue("fill-opacity")) * parseFloat(t.getPropertyValue("opacity")); + colors[i] = stop.offset.baseVal + " " + color[i]; + opacity[i] = (parseFloat(stop.style.getPropertyValue("stop-opacity")) || 1) * parseFloat(t.getPropertyValue("fill-opacity")) * parseFloat(t.getPropertyValue("opacity")); } ele.setAttribute("method", "none"); ele.setAttribute("color", color[0]); @@ -2694,7 +2697,7 @@ ele.setAttribute("focusposition", "0.5 0.5"); if (ele.localName === "rect") { var cx = parseFloat((grad.getAttributeNS(null, "cx") || "0.5")); - var cy = parseFloat((grad.getAttribute(null, "cy") || "0.5")); + var cy = parseFloat((grad.getAttributeNS(null, "cy") || "0.5")); var r = rx = ry = parseFloat((grad.getAttributeNS(null, "r") || "0.5")); var el = this.w, et = this.h, er = 0, eb = 0; var data = this.tar.path.value; @@ -2751,6 +2754,11 @@ function SVGStopElement() { SVGElement.apply(this, arguments); /*readonly SVGAnimatedNumber*/ this.offset = new SVGAnimatedNumber(); + this.addEventListener("DOMAttrModified", function(evt) { + if (evt.attrName === "offset") { + evt.target.offset.baseVal = parseFloat(evt.newValue); + } + }, false); return this; }; SVGStopElement.constructor = SVGElement;