From 4ffb59abe80ff6815866a37447db62933b064813 Mon Sep 17 00:00:00 2001 From: Ulrich-Matthias Schäfer Date: Tue, 22 Jan 2019 19:57:50 +0100 Subject: fixed move and center commands for text - fixed move commands (x, y, move) of text so that it moves text always by the upper left edge. - fixed center commands (cx, cy, center) of text so that it moves text always by the center. --- src/elements/Element.js | 5 +++++ src/elements/Text.js | 43 ++++++++++++++++++++++++++++--------------- src/elements/Tspan.js | 12 ++++++++++++ src/modules/optional/sugar.js | 5 ----- 4 files changed, 45 insertions(+), 20 deletions(-) (limited to 'src') diff --git a/src/elements/Element.js b/src/elements/Element.js index b13ddd5..cefac49 100644 --- a/src/elements/Element.js +++ b/src/elements/Element.js @@ -53,6 +53,11 @@ export default class Element extends Dom { return this.root().defs() } + // Relative move over x and y axes + dmove (x, y) { + return this.dx(x).dy(y) + } + // Relative move over x axis dx (x) { return this.x(new SVGNumber(x).plus(this.x())) diff --git a/src/elements/Text.js b/src/elements/Text.js index cfa3f51..c12c937 100644 --- a/src/elements/Text.js +++ b/src/elements/Text.js @@ -22,36 +22,49 @@ export default class Text extends Shape { } // Move over x-axis - x (x) { - // act as getter + // Text is moved its bounding box + // text-anchor does NOT matter + x (x, box = this.bbox()) { if (x == null) { - return this.attr('x') + return box.x } - return this.attr('x', x) + return this.attr('x', this.attr('x') + x - box.x) } // Move over y-axis - y (y) { - var oy = this.attr('y') - var o = typeof oy === 'number' ? oy - this.bbox().y : 0 - - // act as getter + y (y, box = this.bbox()) { if (y == null) { - return typeof oy === 'number' ? oy - o : oy + return box.y } - return this.attr('y', typeof y === 'number' ? y + o : y) + return this.attr('y', this.attr('y') + y - box.y) + } + + move (x, y, box = this.bbox()) { + return this.x(x, box).y(y, box) } // Move center over x-axis - cx (x) { - return x == null ? this.bbox().cx : this.x(x - this.bbox().width / 2) + cx (x, box = this.bbox()) { + if (x == null) { + return box.cx + } + + return this.attr('x', this.attr('x') + x - box.cx) } // Move center over y-axis - cy (y) { - return y == null ? this.bbox().cy : this.y(y - this.bbox().height / 2) + cy (y, box = this.bbox()) { + if (y == null) { + return box.cy + } + + return this.attr('y', this.attr('y') + y - box.cy) + } + + center (x, y, box = this.bbox()) { + return this.cx(x, box).cy(y, box) } // Set the text content diff --git a/src/elements/Tspan.js b/src/elements/Tspan.js index 64895fc..a9c2deb 100644 --- a/src/elements/Tspan.js +++ b/src/elements/Tspan.js @@ -35,6 +35,18 @@ export default class Tspan extends Text { return this.attr('dy', dy) } + x (x) { + return this.attr('x', x) + } + + y (y) { + return this.attr('x', y) + } + + move (x, y) { + return this.x(x).y(y) + } + // Create new line newLine () { // fetch text parent diff --git a/src/modules/optional/sugar.js b/src/modules/optional/sugar.js index 7aba0f7..0da0fe4 100644 --- a/src/modules/optional/sugar.js +++ b/src/modules/optional/sugar.js @@ -102,11 +102,6 @@ registerMethods([ 'Element', 'Runner' ], { // Opacity opacity: function (value) { return this.attr('opacity', value) - }, - - // Relative move over x and y axes - dmove: function (x, y) { - return this.dx(x).dy(y) } }) -- cgit v1.2.3