Fixed #5689, text had soft line wraps when white-space: nowrap was us…

…ed in combination with text-overflow: ellipsis.
highcharts · Sep 15, 2016 · 6a1fac2 · 6a1fac2
1 parent f0c9389
commit 6a1fac2
Show file tree

Hide file tree

Showing 7 changed files with 47 additions and 8 deletions.
diff --git a/js/highcharts.src.js b/js/highcharts.src.js
@@ -3682,7 +3682,8 @@
                                 // Check width and apply soft breaks or ellipsis
                                 if (width) {
                                     var words = span.replace(/([^\^])-/g, '$1- ').split(' '), // #1273
-                                        hasWhiteSpace = spans.length > 1 || lineNo || (words.length > 1 && textStyles.whiteSpace !== 'nowrap'),
+                                        noWrap = textStyles.whiteSpace === 'nowrap',
+                                        hasWhiteSpace = spans.length > 1 || lineNo || (words.length > 1 && !noWrap),
                                         tooLong,
                                         actualWidth,
                                         rest = [],
@@ -3726,7 +3727,7 @@
                                             words = rest;
                                             rest = [];
 
-                                            if (words.length) {
+                                            if (words.length && !noWrap) {
                                                 softLineNo++;
 
                                                 tspan = doc.createElementNS(SVG_NS, 'tspan');

diff --git a/js/highmaps.src.js b/js/highmaps.src.js
@@ -3680,7 +3680,8 @@
                                 // Check width and apply soft breaks or ellipsis
                                 if (width) {
                                     var words = span.replace(/([^\^])-/g, '$1- ').split(' '), // #1273
-                                        hasWhiteSpace = spans.length > 1 || lineNo || (words.length > 1 && textStyles.whiteSpace !== 'nowrap'),
+                                        noWrap = textStyles.whiteSpace === 'nowrap',
+                                        hasWhiteSpace = spans.length > 1 || lineNo || (words.length > 1 && !noWrap),
                                         tooLong,
                                         actualWidth,
                                         rest = [],
@@ -3724,7 +3725,7 @@
                                             words = rest;
                                             rest = [];
 
-                                            if (words.length) {
+                                            if (words.length && !noWrap) {
                                                 softLineNo++;
 
                                                 tspan = doc.createElementNS(SVG_NS, 'tspan');

diff --git a/js/highstock.src.js b/js/highstock.src.js
@@ -3682,7 +3682,8 @@
                                 // Check width and apply soft breaks or ellipsis
                                 if (width) {
                                     var words = span.replace(/([^\^])-/g, '$1- ').split(' '), // #1273
-                                        hasWhiteSpace = spans.length > 1 || lineNo || (words.length > 1 && textStyles.whiteSpace !== 'nowrap'),
+                                        noWrap = textStyles.whiteSpace === 'nowrap',
+                                        hasWhiteSpace = spans.length > 1 || lineNo || (words.length > 1 && !noWrap),
                                         tooLong,
                                         actualWidth,
                                         rest = [],
@@ -3726,7 +3727,7 @@
                                             words = rest;
                                             rest = [];
 
-                                            if (words.length) {
+                                            if (words.length && !noWrap) {
                                                 softLineNo++;
 
                                                 tspan = doc.createElementNS(SVG_NS, 'tspan');

diff --git a/js/parts/SvgRenderer.js b/js/parts/SvgRenderer.js
@@ -1540,7 +1540,8 @@ SVGRenderer.prototype = {
 							// Check width and apply soft breaks or ellipsis
 							if (width) {
 								var words = span.replace(/([^\^])-/g, '$1- ').split(' '), // #1273
-									hasWhiteSpace = spans.length > 1 || lineNo || (words.length > 1 && textStyles.whiteSpace !== 'nowrap'),
+									noWrap = textStyles.whiteSpace === 'nowrap',
+									hasWhiteSpace = spans.length > 1 || lineNo || (words.length > 1 && !noWrap),
 									tooLong,
 									actualWidth,
 									rest = [],
@@ -1584,7 +1585,7 @@ SVGRenderer.prototype = {
 										words = rest;
 										rest = [];
 
-										if (words.length) {
+										if (words.length && !noWrap) {
 											softLineNo++;
 
 											tspan = doc.createElementNS(SVG_NS, 'tspan');

diff --git a/samples/issues/highcharts-4.2.6/5689-polar-datalabel-wrapping/demo.details b/samples/issues/highcharts-4.2.6/5689-polar-datalabel-wrapping/demo.details
diff --git a/samples/issues/highcharts-4.2.6/5689-polar-datalabel-wrapping/demo.html b/samples/issues/highcharts-4.2.6/5689-polar-datalabel-wrapping/demo.html
@@ -0,0 +1,4 @@
+<script src="https://code.highcharts.com/highcharts.js"></script>
+<script src="https://code.highcharts.com/highcharts-more.js"></script>
+
+<div id="container"></div>
diff --git a/samples/issues/highcharts-4.2.6/5689-polar-datalabel-wrapping/demo.js b/samples/issues/highcharts-4.2.6/5689-polar-datalabel-wrapping/demo.js
@@ -0,0 +1,31 @@
+$(function () {
+
+    var category = "first first first first first first first <br/> second second second <br/> third third third third";
+
+    $('#container').highcharts({
+        "title": {
+            "text": "'first', 'second', and 'third', should be on their own individual lines"
+        },
+        "chart": {
+            "polar": true
+        },
+        "series": [{
+            "data": [5, 4, 2, 6, 7, 8]
+        }],
+        "xAxis": {
+            "labels": {
+                "style": {
+                    "whiteSpace": "nowrap"
+                }
+            },
+            "categories": [
+                category,
+                category,
+                category,
+                category,
+                category,
+                category
+            ]
+        }
+    });
+});