Vectorizer: fix multi-line text line heights when 100% of the line is…

… annotated
clientIO · Aug 31, 2021 · b14d173 · b14d173
1 parent 4244d7a
commit b14d173
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 1 deletion.
diff --git a/src/V/index.mjs b/src/V/index.mjs
@@ -425,7 +425,7 @@ const V = (function() {
                 if (includeAnnotationIndices) vTSpan.attr('annotations', annotation.annotations);
                 // Check for max font size
                 fontSize = parseFloat(annotationAttrs['font-size']);
-                if (fontSize === undefined) fontSize = baseSize;
+                if (!isFinite(fontSize)) fontSize = baseSize;
                 if (fontSize && fontSize > maxFontSize) maxFontSize = fontSize;
             } else {
                 if (eol && j === lastJ) annotation += eol;

diff --git a/test/vectorizer/vectorizer.js b/test/vectorizer/vectorizer.js
@@ -248,6 +248,50 @@ QUnit.module('vectorizer', function(hooks) {
             svg.remove();
         });
 
+        QUnit.test('line height', function(assert) {
+
+            var t = V('text', { 'font-size': 20 });
+            var linesDy;
+            var text = 'abcd\nefgh';
+            var annotations = [
+                { start: 0, end: 4, attrs: { fill: 'red' }},
+                { start: 5, end: 9, attrs: { fill: 'blue' }}
+            ];
+
+            t.text(text, {
+                lineHeight: '2.1em',
+                annotations: annotations
+            });
+
+            linesDy = t.children().map(function(vTSpan) {
+                return vTSpan.attr('dy');
+            });
+            assert.deepEqual(linesDy, ['0', '2.1em']); // hard-coded line-height
+
+            t.text(text, {
+                lineHeight: 'auto',
+                annotations: annotations
+            });
+
+            linesDy = t.children().map(function(vTSpan) {
+                return vTSpan.attr('dy');
+            });
+            assert.deepEqual(linesDy, ['0', '24']); // base font-size * 1.2
+
+            t.text(text, {
+                lineHeight: 'auto',
+                annotations: [
+                    { start: 0, end: 4, attrs: { fill: 'red' }},
+                    { start: 5, end: 9, attrs: { fill: 'blue', 'font-size': 30 }}
+                ]
+            });
+
+            linesDy = t.children().map(function(vTSpan) {
+                return vTSpan.attr('dy');
+            });
+            assert.deepEqual(linesDy, ['0', '36']); // max font-size * 1.2
+        });
+
         QUnit.test('custom EOL', function(assert) {
 
             var svg = getSvg();