diff --git a/package-lock.json b/package-lock.json index ea60b5991d8..8f11af4a333 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4524,9 +4524,9 @@ } }, "gl-axes3d": { - "version": "1.3.2", - "resolved": "https://registry.npmjs.org/gl-axes3d/-/gl-axes3d-1.3.2.tgz", - "integrity": "sha512-djAEyX7pz1C9CICos300JNAbdsFHCb2oWXAg1d/Zge+8VgUg+QayfQemHhVv8JVbcoWulnvZp8K+yQEBnCEhPw==", + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/gl-axes3d/-/gl-axes3d-1.4.0.tgz", + "integrity": "sha512-aakup65ywK7Bo0k/2IAq8AdvtZYHJANskePJpElcmuC1vm0l+4sRKmXevdR9AYBDNh5KEULFSnTe9RHVPvBtxQ==", "requires": { "bit-twiddle": "^1.0.0", "dup": "^1.0.0", @@ -4540,7 +4540,7 @@ "glslify": "^6.1.0", "robust-orientation": "^1.1.3", "split-polygon": "^1.0.0", - "vectorize-text": "^3.0.0" + "vectorize-text": "^3.2.0" } }, "gl-buffer": { @@ -4709,9 +4709,9 @@ } }, "gl-plot2d": { - "version": "1.3.1", - "resolved": "https://registry.npmjs.org/gl-plot2d/-/gl-plot2d-1.3.1.tgz", - "integrity": "sha512-wmZC1ztzkWP03J/1W6yenHwu9c3YzBslIoj/qywkrtO8BXsZeXNAQUidJ2Iq9yvphbOWB3dV0IByNVKKUh3CWw==", + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/gl-plot2d/-/gl-plot2d-1.4.0.tgz", + "integrity": "sha512-cO1R6TSMHZKxpsxT2jSxxZ/sN6KdkPLvpzp1t5W5qB5xUs4RiTmAw1jd9s1ogdZYBqYJVIrj6ktCrua3Ligc+Q==", "requires": { "binary-search-bounds": "^2.0.3", "gl-buffer": "^2.1.2", @@ -4719,7 +4719,7 @@ "gl-shader": "^4.2.1", "glsl-inverse": "^1.0.0", "glslify": "^6.1.0", - "text-cache": "^4.1.0" + "text-cache": "^4.2.0" }, "dependencies": { "binary-search-bounds": { @@ -4730,13 +4730,13 @@ } }, "gl-plot3d": { - "version": "1.5.11", - "resolved": "https://registry.npmjs.org/gl-plot3d/-/gl-plot3d-1.5.11.tgz", - "integrity": "sha512-QgPzFCxhf9Eti3jHwJPGVVtAmMaJKXHo2ie8SZBTqe5OZRtrAq2pV1lz8XW9lOEySYljOGmWpQlr2e6FQuDSgQ==", + "version": "1.6.0", + "resolved": "https://registry.npmjs.org/gl-plot3d/-/gl-plot3d-1.6.0.tgz", + "integrity": "sha512-SWUXVuWlBE+GIQWysB5HmoqBDkkaCydT8JJl5CWyApau3bTtHzEEafMEBBfkc4THmk/3YXgmjmSlXF5vefTo/g==", "requires": { "3d-view-controls": "^2.2.0", "a-big-triangle": "^1.0.0", - "gl-axes3d": "^1.3.2", + "gl-axes3d": "^1.4.0", "gl-fbo": "^2.0.3", "gl-mat4": "^1.1.2", "gl-select-static": "^2.0.2", @@ -4770,9 +4770,9 @@ } }, "gl-scatter3d": { - "version": "1.0.16", - "resolved": "https://registry.npmjs.org/gl-scatter3d/-/gl-scatter3d-1.0.16.tgz", - "integrity": "sha512-i4IytV9pX2r4HBPJsm6M1ZoirtoHzjUC8icz2YF81p6/QO42cYWFgW8Nkr6xD4fwlRkbI1VKa9/Equ0xf5oCZg==", + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/gl-scatter3d/-/gl-scatter3d-1.1.0.tgz", + "integrity": "sha512-8O/YXxRZloG0LPkmd5hr50IMmgbqdvQZ1axH+E90CpBrqez6D24WFJg74vPka2YJf89DIms8i6kElDlSFHCrCA==", "requires": { "gl-buffer": "^2.0.6", "gl-mat4": "^1.0.0", @@ -4782,7 +4782,7 @@ "glslify": "^6.1.0", "is-string-blank": "^1.0.1", "typedarray-pool": "^1.0.2", - "vectorize-text": "^3.0.0" + "vectorize-text": "^3.2.0" }, "dependencies": { "glsl-out-of-range": { @@ -10777,11 +10777,11 @@ } }, "text-cache": { - "version": "4.1.0", - "resolved": "https://registry.npmjs.org/text-cache/-/text-cache-4.1.0.tgz", - "integrity": "sha1-fFgJDoWsCRD5dt9M/Izoqg6lh2Y=", + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/text-cache/-/text-cache-4.2.0.tgz", + "integrity": "sha512-8+W9fHZYOamWTy0Yb7lxMszOWo6sqUT4XvwrCZfaGxM8C8uzOoTQWXgtr/jDpuwozQhKNS3AxnuIaYc1SvV8vg==", "requires": { - "vectorize-text": "^3.0.1" + "vectorize-text": "^3.2.0" } }, "text-table": { @@ -11405,9 +11405,9 @@ } }, "vectorize-text": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/vectorize-text/-/vectorize-text-3.0.2.tgz", - "integrity": "sha1-BasWMOQJ83eWTiuSBbLVWakvYNg=", + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/vectorize-text/-/vectorize-text-3.2.0.tgz", + "integrity": "sha512-N3eldFPkXY7mVK1aBuKPdQKYerBSPEAf+4Tl6DGdnVb1MZ8buD9SKv5TUCyRCEe5KblC56MoJcmf0I/IyGjOGQ==", "requires": { "cdt2d": "^1.0.0", "clean-pslg": "^1.1.0", diff --git a/package.json b/package.json index ebac0650b22..1b1678767e9 100644 --- a/package.json +++ b/package.json @@ -77,10 +77,10 @@ "gl-line3d": "^1.1.6", "gl-mat4": "^1.2.0", "gl-mesh3d": "^2.0.2", - "gl-plot2d": "^1.3.1", - "gl-plot3d": "^1.5.11", + "gl-plot2d": "^1.4.0", + "gl-plot3d": "^1.6.0", "gl-pointcloud2d": "^1.0.1", - "gl-scatter3d": "^1.0.16", + "gl-scatter3d": "^1.1.0", "gl-select-box": "^1.0.2", "gl-spikes2d": "^1.0.1", "gl-streamtube3d": "^1.1.1", diff --git a/src/lib/html2unicode.js b/src/lib/html2unicode.js deleted file mode 100644 index a9ec30b2a4f..00000000000 --- a/src/lib/html2unicode.js +++ /dev/null @@ -1,45 +0,0 @@ -/** -* Copyright 2012-2018, Plotly, Inc. -* All rights reserved. -* -* This source code is licensed under the MIT license found in the -* LICENSE file in the root directory of this source tree. -*/ - - -'use strict'; - -var toSuperScript = require('superscript-text'); -var fixEntities = require('./svg_text_utils').convertEntities; - -function fixSuperScript(x) { - var idx = 0; - - while((idx = x.indexOf('', idx)) >= 0) { - var nidx = x.indexOf('', idx); - if(nidx < idx) break; - - x = x.slice(0, idx) + toSuperScript(x.slice(idx + 5, nidx)) + x.slice(nidx + 6); - } - - return x; -} - -function fixBR(x) { - return x.replace(/\/g, '\n'); -} - -function stripTags(x) { - return x.replace(/\<.*\>/g, ''); -} - -function convertHTMLToUnicode(html) { - return '' + - fixEntities( - stripTags( - fixSuperScript( - fixBR( - html)))); -} - -module.exports = convertHTMLToUnicode; diff --git a/src/plots/gl2d/convert.js b/src/plots/gl2d/convert.js index 5f4f1fcfd15..43ab172a845 100644 --- a/src/plots/gl2d/convert.js +++ b/src/plots/gl2d/convert.js @@ -11,7 +11,6 @@ var Axes = require('../cartesian/axes'); -var convertHTMLToUnicode = require('../../lib/html2unicode'); var str2RGBArray = require('../../lib/str2rgbarray'); function Axes2DOptions(scene) { @@ -118,7 +117,7 @@ proto.merge = function(options) { for(j = 0; j <= 2; j += 2) { this.labelEnable[i + j] = false; - this.labels[i + j] = convertHTMLToUnicode(axTitle); + this.labels[i + j] = axTitle; this.labelColor[i + j] = str2RGBArray(ax.titlefont.color); this.labelFont[i + j] = ax.titlefont.family; this.labelSize[i + j] = ax.titlefont.size; diff --git a/src/plots/gl2d/scene2d.js b/src/plots/gl2d/scene2d.js index 56e12929508..892169cb934 100644 --- a/src/plots/gl2d/scene2d.js +++ b/src/plots/gl2d/scene2d.js @@ -20,7 +20,6 @@ var getContext = require('webgl-context'); var createOptions = require('./convert'); var createCamera = require('./camera'); -var convertHTMLToUnicode = require('../../lib/html2unicode'); var showNoWebGlMsg = require('../../lib/show_no_webgl_msg'); var axisConstraints = require('../cartesian/constraints'); var enforceAxisConstraints = axisConstraints.enforce; @@ -279,7 +278,7 @@ proto.computeTickMarks = function() { for(var j = 0; j < 2; ++j) { for(var i = 0; i < nextTicks[j].length; ++i) { // coercing tick value (may not be a string) to a string - nextTicks[j][i].text = convertHTMLToUnicode(nextTicks[j][i].text + ''); + nextTicks[j][i].text = nextTicks[j][i].text + ''; } } diff --git a/src/plots/gl3d/layout/convert.js b/src/plots/gl3d/layout/convert.js index 6584d5b9cac..8aded799e13 100644 --- a/src/plots/gl3d/layout/convert.js +++ b/src/plots/gl3d/layout/convert.js @@ -9,7 +9,6 @@ 'use strict'; -var convertHTMLToUnicode = require('../../../lib/html2unicode'); var str2RgbaArray = require('../../../lib/str2rgbarray'); var AXES_NAMES = ['xaxis', 'yaxis', 'zaxis']; @@ -84,7 +83,7 @@ proto.merge = function(sceneLayout) { } // Axes labels - opts.labels[i] = convertHTMLToUnicode(axes.title); + opts.labels[i] = axes.title; if('titlefont' in axes) { if(axes.titlefont.color) opts.labelColor[i] = str2RgbaArray(axes.titlefont.color); if(axes.titlefont.family) opts.labelFont[i] = axes.titlefont.family; diff --git a/src/plots/gl3d/layout/tick_marks.js b/src/plots/gl3d/layout/tick_marks.js index 8999e4886c0..471b7396b9b 100644 --- a/src/plots/gl3d/layout/tick_marks.js +++ b/src/plots/gl3d/layout/tick_marks.js @@ -15,7 +15,6 @@ module.exports = computeTickMarks; var Axes = require('../../cartesian/axes'); var Lib = require('../../../lib'); -var convertHTMLToUnicode = require('../../../lib/html2unicode'); var AXES_NAMES = ['xaxis', 'yaxis', 'zaxis']; @@ -73,7 +72,11 @@ function computeTickMarks(scene) { var dataTicks = Axes.calcTicks(axes); for(var j = 0; j < dataTicks.length; ++j) { dataTicks[j].x = dataTicks[j].x * scene.dataScale[i]; - dataTicks[j].text = convertHTMLToUnicode(dataTicks[j].text); + + if(axes.type === 'date') { + dataTicks[j].text = + dataTicks[j].text.replace(/\/g, ' '); + } } ticks[i] = dataTicks; diff --git a/src/plots/gl3d/scene.js b/src/plots/gl3d/scene.js index 4911a4967ff..59ba7a4446e 100644 --- a/src/plots/gl3d/scene.js +++ b/src/plots/gl3d/scene.js @@ -169,7 +169,7 @@ function render(scene) { scene.drawAnnotations(scene); } -function initializeGLPlot(scene, fullLayout, canvas, gl) { +function initializeGLPlot(scene, canvas, gl) { var gd = scene.graphDiv; var glplotOptions = { @@ -318,7 +318,7 @@ function Scene(options, fullLayout) { this.convertAnnotations = Registry.getComponentMethod('annotations3d', 'convert'); this.drawAnnotations = Registry.getComponentMethod('annotations3d', 'draw'); - if(!initializeGLPlot(this, fullLayout)) return; // todo check the necessity for this line + if(!initializeGLPlot(this)) return; // todo check the necessity for this line } var proto = Scene.prototype; @@ -334,7 +334,7 @@ proto.recoverContext = function() { requestAnimationFrame(tryRecover); return; } - if(!initializeGLPlot(scene, scene.fullLayout, canvas, gl)) { + if(!initializeGLPlot(scene, canvas, gl)) { Lib.error('Catastrophic and unrecoverable WebGL error. Context lost.'); return; } diff --git a/test/image/baselines/gl3d_formatted-text-on-multiple-lines.png b/test/image/baselines/gl3d_formatted-text-on-multiple-lines.png new file mode 100644 index 00000000000..b8dc14117e4 Binary files /dev/null and b/test/image/baselines/gl3d_formatted-text-on-multiple-lines.png differ diff --git a/test/image/baselines/gl3d_line_rectangle_render.png b/test/image/baselines/gl3d_line_rectangle_render.png index 2e59beadd26..35a1e9c8cca 100644 Binary files a/test/image/baselines/gl3d_line_rectangle_render.png and b/test/image/baselines/gl3d_line_rectangle_render.png differ diff --git a/test/image/baselines/gl3d_log-axis-big.png b/test/image/baselines/gl3d_log-axis-big.png index 9024925b287..5fecfae721c 100644 Binary files a/test/image/baselines/gl3d_log-axis-big.png and b/test/image/baselines/gl3d_log-axis-big.png differ diff --git a/test/image/mocks/gl3d_formatted-text-on-multiple-lines.json b/test/image/mocks/gl3d_formatted-text-on-multiple-lines.json new file mode 100644 index 00000000000..1885729a887 --- /dev/null +++ b/test/image/mocks/gl3d_formatted-text-on-multiple-lines.json @@ -0,0 +1,48 @@ +{ + "data": [ + { + "x": [3], + "y": [0], + "z": [2], + "text": ["This text was too long.
But right now it is
presented on
multiple lines!
It is now
also possible to use Super and Sub
texts either lower or UPPER cases.

AaXx23.5Ab
AaXx23.5Ab"], + "type": "scatter3d", + "mode":"markers+text", + "textposition": "middle center" + } + ], + "layout": { + "title":"Now texts could be displayed in 3D on multiple lines.", + "width": 1200, + "height": 900, + "scene":{ + "xaxis":{ + "titlefont": { + "color": "#f00", + "family": "Sans-Serif", + "size": 18 + }, + "title": "An axis with
Italic & bold info! &\nSay no to '\\n'.
Only use <'br'> for line breaks." + }, + "yaxis":{ + "titlefont": { + "color": "#00f", + "family": "Times New Roman", + "size": 32 + }, + "title": "Ix2n3 + z(ni+Log[yx2])" + }, + "zaxis":{ + "titlefont": { + "color": "#0f0", + "family": "Courier New", + "size": 18 + }, + "title": "A long
axis presented
on multiple lines."}, + "camera":{ + "eye":{"x":-1.5,"y":1.5,"z":1.5}, + "center":{"x":0,"y":0,"z":0}, + "up":{"x":0,"y":0,"z":1} + } + } + } +}