Fix how we resize the parent svg element.
Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/eed930cb Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/eed930cb Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/eed930cb Branch: refs/heads/develop Commit: eed930cbdb7c71d9c1c402b9331091c7f0c72679 Parents: 43cdf55 Author: Om <[email protected]> Authored: Tue Sep 9 17:40:19 2014 -0700 Committer: Om <[email protected]> Committed: Tue Sep 9 17:40:19 2014 -0700 ---------------------------------------------------------------------- examples/FlexJSTest_SVG/src/GraphicsView.mxml | 4 +- .../src/org/apache/flex/core/graphics/Circle.js | 3 +- .../org/apache/flex/core/graphics/Ellipse.js | 2 +- .../apache/flex/core/graphics/GraphicShape.js | 48 +++++++++++--------- .../src/org/apache/flex/core/graphics/Path.js | 2 +- .../src/org/apache/flex/core/graphics/Rect.js | 2 +- 6 files changed, 32 insertions(+), 29 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/eed930cb/examples/FlexJSTest_SVG/src/GraphicsView.mxml ---------------------------------------------------------------------- diff --git a/examples/FlexJSTest_SVG/src/GraphicsView.mxml b/examples/FlexJSTest_SVG/src/GraphicsView.mxml index 0ad9031..1ef90a4 100644 --- a/examples/FlexJSTest_SVG/src/GraphicsView.mxml +++ b/examples/FlexJSTest_SVG/src/GraphicsView.mxml @@ -140,7 +140,7 @@ limitations under the License. path1.stroke = stroke; path1.drawPath(50,50,"M14.165 0 16.3838 2.21924 5.24023 13.3232 0 8.52441 2.18164 6.11719 5.37305 9.06348 14.165 0Z"); this.addElement(path1); - + var path2:Path = new Path(); fill.color = 0x00FF00; fill.alpha = 0.5; @@ -150,7 +150,7 @@ limitations under the License. path2.stroke = stroke; path2.drawPath(250,500,"M150 0 L75 200 L225 200 Z"); this.addElement(path2); - + var path3:Path = new Path(); fill.color = 0x00FF00; fill.alpha = 0.5; http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/eed930cb/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Circle.js ---------------------------------------------------------------------- diff --git a/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Circle.js b/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Circle.js index 3d26b5a..b02b371 100644 --- a/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Circle.js +++ b/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Circle.js @@ -55,6 +55,5 @@ org.apache.flex.core.graphics.Circle.prototype.drawCircle = function(x, y, radiu circle.setAttribute('rx', String(radius)); circle.setAttribute('ry', String(radius)); this.element.appendChild(circle); -// this.resize(x-radius,y-radius,radius*2+this.get_stroke().get_weight()*2,radius*2+this.get_stroke().get_weight()*2); - this.setPosition(x - radius + this.get_stroke().get_weight(), y - radius + this.get_stroke().get_weight()); + this.setPosition(x-radius, y-radius, this.get_stroke().get_weight(), this.get_stroke().get_weight()); }; http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/eed930cb/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Ellipse.js ---------------------------------------------------------------------- diff --git a/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Ellipse.js b/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Ellipse.js index 67ed4e2..2366194 100644 --- a/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Ellipse.js +++ b/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Ellipse.js @@ -56,5 +56,5 @@ org.apache.flex.core.graphics.Ellipse.prototype.drawEllipse = function(x, y, wid ellipse.setAttribute('rx', String(width / 2)); ellipse.setAttribute('ry', String(height / 2)); this.element.appendChild(ellipse); - this.setPosition(x + this.get_stroke().get_weight(), y + this.get_stroke().get_weight()); + this.setPosition(x, y, this.get_stroke().get_weight()*2, this.get_stroke().get_weight()*2); }; http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/eed930cb/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/GraphicShape.js ---------------------------------------------------------------------- diff --git a/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/GraphicShape.js b/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/GraphicShape.js index 271c52c..8d514fa 100644 --- a/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/GraphicShape.js +++ b/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/GraphicShape.js @@ -19,7 +19,6 @@ goog.require('org.apache.flex.core.graphics.SolidColor'); goog.require('org.apache.flex.core.graphics.SolidColorStroke'); - /** * @constructor */ @@ -49,16 +48,27 @@ org.apache.flex.core.graphics.GraphicShape = function() { */ this.y_ = 0; + /** + * @private + * @type {number} + */ + this.xOffset_ = 0; + + /** + * @private + * @type {number} + */ + this.yOffset_ = 0; + /** * @expose * @type {SVGElement} */ - this.element = document.createElementNS('http://www.w3.org/2000/svg', 'svg'); + this.element = document.createElementNS("http://www.w3.org/2000/svg","svg";); }; - /** * Metadata * @@ -77,7 +87,6 @@ org.apache.flex.core.graphics.GraphicShape.prototype.get_fill = function() { return this.fill_; }; - /** * @param {org.apache.flex.core.graphics.SolidColor} value The fill object. */ @@ -85,7 +94,6 @@ org.apache.flex.core.graphics.GraphicShape.prototype.set_fill = function(value) this.fill_ = value; }; - /** * @expose * @return {org.apache.flex.core.graphics.SolidColorStroke} The stroke object. @@ -94,7 +102,6 @@ org.apache.flex.core.graphics.GraphicShape.prototype.get_stroke = function() { return this.stroke_; }; - /** * @expose * @param {org.apache.flex.core.graphics.SolidColorStroke} value The stroke object. @@ -103,19 +110,15 @@ org.apache.flex.core.graphics.GraphicShape.prototype.set_stroke = function(value this.stroke_ = value; }; - -/** - * @override - */ org.apache.flex.core.graphics.GraphicShape.prototype.addedToParent = function() { var bbox = this.element.getBBox(); - this.resize(this.x_, this.y_, bbox.width + this.x_ * 2, bbox.height + this.y_ * 2); + this.resize(this.x_, this.y_, bbox); }; /** * @expose - * @return {String} The style attribute. + * @return {string} The style attribute. */ org.apache.flex.core.graphics.GraphicShape.prototype.getStyleStr = function() { var color = Number(this.get_fill().get_color()).toString(16); @@ -125,32 +128,33 @@ org.apache.flex.core.graphics.GraphicShape.prototype.getStyleStr = function() { if (strokeColor.length == 2) strokeColor = '00' + strokeColor; if (strokeColor.length == 4) strokeColor = '00' + strokeColor; - return 'fill:#' + String(color) + ';stroke:#' + String(strokeColor) + ';stroke-width:' + - String(this.get_stroke().get_weight()) + ';fill-opacity:' + String(this.get_fill().get_alpha()); + return 'fill:#' + String(color) + ';fill-opacity:' + String(this.get_fill().get_alpha()) + ';stroke:#' + String(strokeColor) + ';stroke-width:' + + String(this.get_stroke().get_weight()) + ';stroke-opacity:' + String(this.get_stroke().get_alpha()) ; }; - /** * @expose * @param {number} x X position. * @param {number} y Y position. - * @param {number} w Width. - * @param {number} h Height. + * @param {Object} bbox The bounding box of the svg element. */ -org.apache.flex.core.graphics.GraphicShape.prototype.resize = function(x, y, w, h) { - this.element.setAttribute('width', String(w) + 'px'); - this.element.setAttribute('height', String(h) + 'px'); +org.apache.flex.core.graphics.GraphicShape.prototype.resize = function(x, y, bbox) { + this.element.setAttribute('width', String(bbox.width + bbox.x + this.xOffset_) + 'px'); + this.element.setAttribute('height', String(bbox.height + bbox.y + this.yOffset_) + 'px'); this.element.setAttribute('style', 'position:absolute; left:' + String(x) + 'px; top:' + String(y) + 'px;'); + //this.element.setAttribute('viewBox', String(bbox.x - this.xOffset_) + ' ' + String(bbox.y - this.yOffset_) + + // ' ' + String(bbox.x + this.xOffset_) + ' ' + String(bbox.y + this.yOffset_)); }; - /** * @expose * @param {number} x X position. * @param {number} y Y position. */ -org.apache.flex.core.graphics.GraphicShape.prototype.setPosition = function(x, y) { +org.apache.flex.core.graphics.GraphicShape.prototype.setPosition = function(x, y, xOffset, yOffset) { this.x_ = x; this.y_ = y; + this.xOffset_ = xOffset; + this.yOffset_ = yOffset; }; http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/eed930cb/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Path.js ---------------------------------------------------------------------- diff --git a/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Path.js b/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Path.js index 441afb6..fd38630 100644 --- a/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Path.js +++ b/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Path.js @@ -58,5 +58,5 @@ org.apache.flex.core.graphics.Path.prototype.drawPath = function(x, y, data) { path.setAttribute('style', style); path.setAttribute('d', data); this.element.appendChild(path); - this.setPosition(x + this.get_stroke().get_weight(), y + this.get_stroke().get_weight()); + this.setPosition(x, y, this.get_stroke().get_weight(), this.get_stroke().get_weight()); }; http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/eed930cb/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Rect.js ---------------------------------------------------------------------- diff --git a/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Rect.js b/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Rect.js index b2ec8e0..016480b 100644 --- a/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Rect.js +++ b/frameworks/js/FlexJS/src/org/apache/flex/core/graphics/Rect.js @@ -56,5 +56,5 @@ org.apache.flex.core.graphics.Rect.prototype.drawRect = function(x, y, width, he rect.setAttribute('width', String(width)); rect.setAttribute('height', String(height)); this.element.appendChild(rect); - this.setPosition(x + this.get_stroke().get_weight(), y + this.get_stroke().get_weight()); + this.setPosition(x, y, this.get_stroke().get_weight(), this.get_stroke().get_weight()); };
