diff --git a/src/lib/index.js b/src/lib/index.js index bd0979d2848..22987794533 100644 --- a/src/lib/index.js +++ b/src/lib/index.js @@ -1186,8 +1186,10 @@ lib.isHidden = function(gd) { * @param {object} transform * - targetX: desired position on the x-axis * - targetY: desired position on the y-axis - * - textX: width of text - * - textY: height of text + * - textX: text middle position on the x-axis + * - textY: text middle position on the y-axis + * - anchorX: (optional) text anchor position on the x-axis (computed from textX), zero for middle anchor + * - anchorY: (optional) text anchor position on the y-axis (computed from textY), zero for middle anchor * - scale: (optional) scale applied after translate * - rotate: (optional) rotation applied after scale * - noCenter: when defined no extra arguments needed in rotation @@ -1198,6 +1200,8 @@ lib.getTextTransform = function(transform) { var textY = transform.textY; var targetX = transform.targetX; var targetY = transform.targetY; + var anchorX = transform.anchorX || 0; + var anchorY = transform.anchorY || 0; var rotate = transform.rotate; var scale = transform.scale; if(!scale) scale = 0; @@ -1205,8 +1209,8 @@ lib.getTextTransform = function(transform) { return ( 'translate(' + - (targetX - scale * textX) + ',' + - (targetY - scale * textY) + + (targetX - scale * (textX + anchorX)) + ',' + + (targetY - scale * (textY + anchorY)) + ')' + (scale < 1 ? 'scale(' + scale + ')' : '' diff --git a/src/traces/bar/defaults.js b/src/traces/bar/defaults.js index 99d4643bbd6..d6284ff5351 100644 --- a/src/traces/bar/defaults.js +++ b/src/traces/bar/defaults.js @@ -127,6 +127,7 @@ function handleText(traceIn, traceOut, layout, coerce, textposition, opts) { var moduleHasCliponaxis = !(opts.moduleHasCliponaxis === false); var moduleHasTextangle = !(opts.moduleHasTextangle === false); var moduleHasInsideanchor = !(opts.moduleHasInsideanchor === false); + var hasPathbar = !!opts.hasPathbar; var hasBoth = Array.isArray(textposition) || textposition === 'auto'; var hasInside = hasBoth || textposition === 'inside'; @@ -147,8 +148,15 @@ function handleText(traceIn, traceOut, layout, coerce, textposition, opts) { } coerceFont(coerce, 'insidetextfont', insideTextFontDefault); - if(hasOutside) coerceFont(coerce, 'outsidetextfont', dfltFont); + if(hasPathbar) { + var pathbarTextFontDefault = Lib.extendFlat({}, dfltFont); + if(isColorInheritedFromLayoutFont) { + delete pathbarTextFontDefault.color; + } + coerceFont(coerce, 'pathbar.textfont', pathbarTextFontDefault); + } + if(hasOutside) coerceFont(coerce, 'outsidetextfont', dfltFont); if(moduleHasSelected) coerce('selected.textfont.color'); if(moduleHasUnselected) coerce('unselected.textfont.color'); diff --git a/src/traces/bar/plot.js b/src/traces/bar/plot.js index 2596d62e2d9..d99a7194c69 100644 --- a/src/traces/bar/plot.js +++ b/src/traces/bar/plot.js @@ -19,6 +19,10 @@ var Drawing = require('../../components/drawing'); var Registry = require('../../registry'); var tickText = require('../../plots/cartesian/axes').tickText; +var uniformText = require('./uniform_text'); +var recordMinTextSize = uniformText.recordMinTextSize; +var clearMinTextSize = uniformText.clearMinTextSize; + var style = require('./style'); var helpers = require('./helpers'); var constants = require('./constants'); @@ -58,8 +62,8 @@ function getXY(di, xa, ya, isHorizontal) { return isHorizontal ? [s, p] : [p, s]; } -function transition(selection, opts, makeOnCompleteCallback) { - if(hasTransition(opts)) { +function transition(selection, fullLayout, opts, makeOnCompleteCallback) { + if(!fullLayout.uniformtext.mode && hasTransition(opts)) { var onComplete; if(makeOnCompleteCallback) { onComplete = makeOnCompleteCallback(); @@ -91,6 +95,9 @@ function plot(gd, plotinfo, cdModule, traceLayer, opts, makeOnCompleteCallback) gap: fullLayout.bargap, groupgap: fullLayout.bargroupgap }; + + // don't clear bar when this is called from waterfall or funnel + clearMinTextSize('bar', fullLayout); } var bartraces = Lib.makeTraceGroups(traceLayer, cdModule, 'trace bars').each(function(cd) { @@ -209,13 +216,13 @@ function plot(gd, plotinfo, cdModule, traceLayer, opts, makeOnCompleteCallback) y1 = fixpx(y1, y0); } - var sel = transition(Lib.ensureSingle(bar, 'path'), opts, makeOnCompleteCallback); + var sel = transition(Lib.ensureSingle(bar, 'path'), fullLayout, opts, makeOnCompleteCallback); sel .style('vector-effect', 'non-scaling-stroke') .attr('d', 'M' + x0 + ',' + y0 + 'V' + y1 + 'H' + x1 + 'V' + y0 + 'Z') .call(Drawing.setClipUrl, plotinfo.layerClipId, gd); - if(hasTransition(opts)) { + if(!fullLayout.uniformtext.mode && hasTransition(opts)) { var styleFns = Drawing.makePointStyleFns(trace); Drawing.singlePointStyle(di, sel, trace, styleFns, gd); } @@ -409,47 +416,39 @@ function appendBarText(gd, plotinfo, bar, cd, i, x0, x1, y0, y1, opts, makeOnCom recordMinTextSize(trace.type, transform, fullLayout); calcBar.transform = transform; - transition(textSelection, opts, makeOnCompleteCallback) + transition(textSelection, fullLayout, opts, makeOnCompleteCallback) .attr('transform', Lib.getTextTransform(transform)); } -function recordMinTextSize( - traceType, // in - transform, // inout - fullLayout // inout -) { - if(fullLayout.uniformtext.mode) { - var minKey = '_' + traceType + 'Text_minsize'; - var minSize = fullLayout.uniformtext.minsize; - var size = transform.scale * transform.fontSize; - - transform.hide = size < minSize; - - fullLayout[minKey] = fullLayout[minKey] || Infinity; - if(!transform.hide) { - fullLayout[minKey] = Math.min( - fullLayout[minKey], - Math.max(size, minSize) - ); - } - } -} - function getRotateFromAngle(angle) { return (angle === 'auto') ? 0 : angle; } +function getRotatedTextSize(textBB, rotate) { + var a = Math.PI / 180 * rotate; + var absSin = Math.abs(Math.sin(a)); + var absCos = Math.abs(Math.cos(a)); + + return { + x: textBB.width * absCos + textBB.height * absSin, + y: textBB.width * absSin + textBB.height * absCos + }; +} + function toMoveInsideBar(x0, x1, y0, y1, textBB, opts) { var isHorizontal = !!opts.isHorizontal; var constrained = !!opts.constrained; var angle = opts.angle || 0; - var anchor = opts.anchor || 0; + var anchor = opts.anchor || 'end'; + var isEnd = anchor === 'end'; + var isStart = anchor === 'start'; var textWidth = textBB.width; var textHeight = textBB.height; var lx = Math.abs(x1 - x0); var ly = Math.abs(y1 - y0); + // compute remaining space var textpad = ( lx > (2 * TEXTPAD) && ly > (2 * TEXTPAD) @@ -458,67 +457,64 @@ function toMoveInsideBar(x0, x1, y0, y1, textBB, opts) { lx -= 2 * textpad; ly -= 2 * textpad; - var autoRotate = (angle === 'auto'); - var isAutoRotated = false; - if(autoRotate && + var rotate = getRotateFromAngle(angle); + if((angle === 'auto') && !(textWidth <= lx && textHeight <= ly) && (textWidth > lx || textHeight > ly) && ( !(textWidth > ly || textHeight > lx) || ((textWidth < textHeight) !== (lx < ly)) )) { - isAutoRotated = true; + rotate += 90; } - if(isAutoRotated) { - // don't rotate yet only swap bar width with height - var tmp = ly; - ly = lx; - lx = tmp; - } + var t = getRotatedTextSize(textBB, rotate); - var rotate = getRotateFromAngle(angle); - var absSin = Math.abs(Math.sin(Math.PI / 180 * rotate)); - var absCos = Math.abs(Math.cos(Math.PI / 180 * rotate)); - - // compute and apply text padding - var dx = Math.max(lx * absCos, ly * absSin); - var dy = Math.max(lx * absSin, ly * absCos); - - var scale = (constrained) ? - Math.min(dx / textWidth, dy / textHeight) : - Math.max(absCos, absSin); - - scale = Math.min(1, scale); + var scale = 1; + if(constrained) { + scale = Math.min( + 1, + lx / t.x, + ly / t.y + ); + } // compute text and target positions + var textX = (textBB.left + textBB.right) / 2; + var textY = (textBB.top + textBB.bottom) / 2; var targetX = (x0 + x1) / 2; var targetY = (y0 + y1) / 2; - - if(anchor !== 'middle') { // case of 'start' or 'end' - var targetWidth = scale * (isHorizontal !== isAutoRotated ? textHeight : textWidth); - var targetHeight = scale * (isHorizontal !== isAutoRotated ? textWidth : textHeight); - textpad += 0.5 * (targetWidth * absSin + targetHeight * absCos); + var anchorX = 0; + var anchorY = 0; + if(isStart || isEnd) { + var extrapad = (isHorizontal ? t.x : t.y) / 2; + var dir = isHorizontal ? dirSign(x0, x1) : dirSign(y0, y1); if(isHorizontal) { - textpad *= dirSign(x0, x1); - targetX = (anchor === 'start') ? x0 + textpad : x1 - textpad; + if(isStart) { + targetX = x0 + dir * textpad; + anchorX = -dir * extrapad; + } else { + targetX = x1 - dir * textpad; + anchorX = dir * extrapad; + } } else { - textpad *= dirSign(y0, y1); - targetY = (anchor === 'start') ? y0 + textpad : y1 - textpad; + if(isStart) { + targetY = y0 + dir * textpad; + anchorY = -dir * extrapad; + } else { + targetY = y1 - dir * textpad; + anchorY = dir * extrapad; + } } } - var textX = (textBB.left + textBB.right) / 2; - var textY = (textBB.top + textBB.bottom) / 2; - - // lastly apply auto rotation - if(isAutoRotated) rotate += 90; - return { textX: textX, textY: textY, targetX: targetX, targetY: targetY, + anchorX: anchorX, + anchorY: anchorY, scale: scale, rotate: rotate }; @@ -552,31 +548,33 @@ function toMoveOutsideBar(x0, x1, y0, y1, textBB, opts) { } var rotate = getRotateFromAngle(angle); - var absSin = Math.abs(Math.sin(Math.PI / 180 * rotate)); - var absCos = Math.abs(Math.cos(Math.PI / 180 * rotate)); + var t = getRotatedTextSize(textBB, rotate); // compute text and target positions - var targetWidth = scale * (isHorizontal ? textHeight : textWidth); - var targetHeight = scale * (isHorizontal ? textWidth : textHeight); - textpad += 0.5 * (targetWidth * absSin + targetHeight * absCos); - + var extrapad = (isHorizontal ? t.x : t.y) / 2; + var textX = (textBB.left + textBB.right) / 2; + var textY = (textBB.top + textBB.bottom) / 2; var targetX = (x0 + x1) / 2; var targetY = (y0 + y1) / 2; + var anchorX = 0; + var anchorY = 0; + var dir = isHorizontal ? dirSign(x1, x0) : dirSign(y0, y1); if(isHorizontal) { - targetX = x1 - textpad * dirSign(x1, x0); + targetX = x1 - dir * textpad; + anchorX = dir * extrapad; } else { - targetY = y1 + textpad * dirSign(y0, y1); + targetY = y1 + dir * textpad; + anchorY = -dir * extrapad; } - var textX = (textBB.left + textBB.right) / 2; - var textY = (textBB.top + textBB.bottom) / 2; - return { textX: textX, textY: textY, targetX: targetX, targetY: targetY, + anchorX: anchorX, + anchorY: anchorY, scale: scale, rotate: rotate }; @@ -749,6 +747,5 @@ function calcTextinfo(cd, index, xa, ya) { module.exports = { plot: plot, - toMoveInsideBar: toMoveInsideBar, - recordMinTextSize: recordMinTextSize + toMoveInsideBar: toMoveInsideBar }; diff --git a/src/traces/bar/style.js b/src/traces/bar/style.js index f3c8af45d3d..3b0bb7cd86f 100644 --- a/src/traces/bar/style.js +++ b/src/traces/bar/style.js @@ -14,42 +14,13 @@ var Drawing = require('../../components/drawing'); var Lib = require('../../lib'); var Registry = require('../../registry'); +var resizeText = require('./uniform_text').resizeText; var attributes = require('./attributes'); var attributeTextFont = attributes.textfont; var attributeInsideTextFont = attributes.insidetextfont; var attributeOutsideTextFont = attributes.outsidetextfont; var helpers = require('./helpers'); -function resizeText(gd, gTrace, traceType) { - var fullLayout = gd._fullLayout; - var minSize = fullLayout['_' + traceType + 'Text_minsize']; - if(minSize) { - var shouldHide = fullLayout.uniformtext.mode === 'hide'; - - var t; - switch(traceType) { - case 'funnelarea' : - case 'pie' : - case 'sunburst' : - case 'treemap' : - t = gTrace.selectAll('g.slice'); - break; - default : - t = gTrace.selectAll('g.points > g.point'); - } - - t.each(function(d) { - var transform = d.transform; - if(transform) { - transform.scale = (shouldHide && transform.hide) ? 0 : minSize / transform.fontSize; - - var el = d3.select(this).select('text'); - el.attr('transform', Lib.getTextTransform(transform)); - } - }); - } -} - function style(gd) { var s = d3.select(gd).selectAll('g.barlayer').selectAll('g.trace'); resizeText(gd, s, 'bar'); diff --git a/src/traces/bar/uniform_text.js b/src/traces/bar/uniform_text.js new file mode 100644 index 00000000000..7052a59f076 --- /dev/null +++ b/src/traces/bar/uniform_text.js @@ -0,0 +1,84 @@ +/** +* Copyright 2012-2020, 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 d3 = require('d3'); +var Lib = require('../../lib'); + +function resizeText(gd, gTrace, traceType) { + var fullLayout = gd._fullLayout; + var minSize = fullLayout['_' + traceType + 'Text_minsize']; + if(minSize) { + var shouldHide = fullLayout.uniformtext.mode === 'hide'; + + var selector; + switch(traceType) { + case 'funnelarea' : + case 'pie' : + case 'sunburst' : + selector = 'g.slice'; + break; + case 'treemap' : + selector = 'g.slice, g.pathbar'; + break; + default : + selector = 'g.points > g.point'; + } + + gTrace.selectAll(selector).each(function(d) { + var transform = d.transform; + if(transform) { + transform.scale = (shouldHide && transform.hide) ? 0 : minSize / transform.fontSize; + + var el = d3.select(this).select('text'); + el.attr('transform', Lib.getTextTransform(transform)); + } + }); + } +} + +function recordMinTextSize( + traceType, // in + transform, // inout + fullLayout // inout +) { + if(fullLayout.uniformtext.mode) { + var minKey = getMinKey(traceType); + var minSize = fullLayout.uniformtext.minsize; + var size = transform.scale * transform.fontSize; + + transform.hide = size < minSize; + + fullLayout[minKey] = fullLayout[minKey] || Infinity; + if(!transform.hide) { + fullLayout[minKey] = Math.min( + fullLayout[minKey], + Math.max(size, minSize) + ); + } + } +} + +function clearMinTextSize( + traceType, // in + fullLayout // inout +) { + var minKey = getMinKey(traceType); + fullLayout[minKey] = undefined; +} + +function getMinKey(traceType) { + return '_' + traceType + 'Text_minsize'; +} + +module.exports = { + recordMinTextSize: recordMinTextSize, + clearMinTextSize: clearMinTextSize, + resizeText: resizeText +}; diff --git a/src/traces/funnel/plot.js b/src/traces/funnel/plot.js index d4892e94f00..31aa1e8f17e 100644 --- a/src/traces/funnel/plot.js +++ b/src/traces/funnel/plot.js @@ -11,15 +11,18 @@ var d3 = require('d3'); var Lib = require('../../lib'); var Drawing = require('../../components/drawing'); -var barPlot = require('../bar/plot').plot; +var barPlot = require('../bar/plot'); +var clearMinTextSize = require('../bar/uniform_text').clearMinTextSize; module.exports = function plot(gd, plotinfo, cdModule, traceLayer) { var fullLayout = gd._fullLayout; + clearMinTextSize('funnel', fullLayout); + plotConnectorRegions(gd, plotinfo, cdModule, traceLayer); plotConnectorLines(gd, plotinfo, cdModule, traceLayer); - barPlot(gd, plotinfo, cdModule, traceLayer, { + barPlot.plot(gd, plotinfo, cdModule, traceLayer, { mode: fullLayout.funnelmode, norm: fullLayout.funnelmode, gap: fullLayout.funnelgap, diff --git a/src/traces/funnel/style.js b/src/traces/funnel/style.js index 58f1172c95a..35a7533449d 100644 --- a/src/traces/funnel/style.js +++ b/src/traces/funnel/style.js @@ -14,7 +14,7 @@ var Drawing = require('../../components/drawing'); var Color = require('../../components/color'); var DESELECTDIM = require('../../constants/interactions').DESELECTDIM; var barStyle = require('../bar/style'); -var resizeText = barStyle.resizeText; +var resizeText = require('../bar/uniform_text').resizeText; var styleTextPoints = barStyle.styleTextPoints; function style(gd, cd, sel) { diff --git a/src/traces/funnelarea/plot.js b/src/traces/funnelarea/plot.js index 3420f645f73..672835bc456 100644 --- a/src/traces/funnelarea/plot.js +++ b/src/traces/funnelarea/plot.js @@ -16,8 +16,9 @@ var svgTextUtils = require('../../lib/svg_text_utils'); var barPlot = require('../bar/plot'); var toMoveInsideBar = barPlot.toMoveInsideBar; -var recordMinTextSize = barPlot.recordMinTextSize; - +var uniformText = require('../bar/uniform_text'); +var recordMinTextSize = uniformText.recordMinTextSize; +var clearMinTextSize = uniformText.clearMinTextSize; var pieHelpers = require('../pie/helpers'); var piePlot = require('../pie/plot'); @@ -32,6 +33,8 @@ var formatSliceLabel = piePlot.formatSliceLabel; module.exports = function plot(gd, cdModule) { var fullLayout = gd._fullLayout; + clearMinTextSize('funnelarea', fullLayout); + prerenderTitles(cdModule, gd); layoutAreas(cdModule, fullLayout._size); diff --git a/src/traces/funnelarea/style.js b/src/traces/funnelarea/style.js index dc97ef4805c..88f5ba9ea30 100644 --- a/src/traces/funnelarea/style.js +++ b/src/traces/funnelarea/style.js @@ -11,7 +11,7 @@ var d3 = require('d3'); var styleOne = require('../pie/style_one'); -var resizeText = require('../bar/style').resizeText; +var resizeText = require('../bar/uniform_text').resizeText; module.exports = function style(gd) { var s = gd._fullLayout._funnelarealayer.selectAll('.trace'); diff --git a/src/traces/pie/plot.js b/src/traces/pie/plot.js index 791c0a83802..b8505618ef9 100644 --- a/src/traces/pie/plot.js +++ b/src/traces/pie/plot.js @@ -16,7 +16,9 @@ var Color = require('../../components/color'); var Drawing = require('../../components/drawing'); var Lib = require('../../lib'); var svgTextUtils = require('../../lib/svg_text_utils'); -var recordMinTextSize = require('../bar/plot').recordMinTextSize; +var uniformText = require('../bar/uniform_text'); +var recordMinTextSize = uniformText.recordMinTextSize; +var clearMinTextSize = uniformText.clearMinTextSize; var helpers = require('./helpers'); var eventData = require('./event_data'); @@ -26,6 +28,8 @@ function plot(gd, cdModule) { var fullLayout = gd._fullLayout; var gs = fullLayout._size; + clearMinTextSize('pie', fullLayout); + prerenderTitles(cdModule, gd); layoutAreas(cdModule, gs); diff --git a/src/traces/pie/style.js b/src/traces/pie/style.js index 021f2e7d2e6..ce4e0ea4ec9 100644 --- a/src/traces/pie/style.js +++ b/src/traces/pie/style.js @@ -11,7 +11,7 @@ var d3 = require('d3'); var styleOne = require('./style_one'); -var resizeText = require('../bar/style').resizeText; +var resizeText = require('../bar/uniform_text').resizeText; module.exports = function style(gd) { var s = gd._fullLayout._pielayer.selectAll('.trace'); diff --git a/src/traces/sunburst/defaults.js b/src/traces/sunburst/defaults.js index 813b1473c89..cd034ca75fb 100644 --- a/src/traces/sunburst/defaults.js +++ b/src/traces/sunburst/defaults.js @@ -44,7 +44,10 @@ module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout if(lineWidth) coerce('marker.line.color', layout.paper_bgcolor); coerce('marker.colors'); - var withColorscale = traceOut._hasColorscale = hasColorscale(traceIn, 'marker', 'colors'); + var withColorscale = traceOut._hasColorscale = ( + hasColorscale(traceIn, 'marker', 'colors') || + (traceIn.marker || {}).coloraxis // N.B. special logic to consider "values" colorscales + ); if(withColorscale) { colorscaleDefaults(traceIn, traceOut, layout, coerce, {prefix: 'marker.', cLetter: 'c'}); } diff --git a/src/traces/sunburst/helpers.js b/src/traces/sunburst/helpers.js index d9293c09939..68cf4a72152 100644 --- a/src/traces/sunburst/helpers.js +++ b/src/traces/sunburst/helpers.js @@ -83,11 +83,16 @@ function determineOutsideTextFont(trace, pt, layoutFont) { }; } -function determineInsideTextFont(trace, pt, layoutFont, cont) { +function determineInsideTextFont(trace, pt, layoutFont, opts) { + var onPathbar = (opts || {}).onPathbar; + var cdi = pt.data.data; var ptNumber = cdi.i; - var customColor = Lib.castOption(trace, ptNumber, 'insidetextfont.color'); + var customColor = Lib.castOption(trace, ptNumber, + (onPathbar ? 'pathbar.textfont' : 'insidetextfont') + '.color' + ); + if(!customColor && trace._input.textfont) { // Why not simply using trace.textfont? Because if not set, it // defaults to layout.font which has a default color. But if @@ -98,16 +103,18 @@ function determineInsideTextFont(trace, pt, layoutFont, cont) { return { color: customColor || Color.contrast(cdi.color), - family: exports.getInsideTextFontKey('family', cont || trace, pt, layoutFont), - size: exports.getInsideTextFontKey('size', cont || trace, pt, layoutFont) + family: exports.getInsideTextFontKey('family', trace, pt, layoutFont, opts), + size: exports.getInsideTextFontKey('size', trace, pt, layoutFont, opts) }; } -exports.getInsideTextFontKey = function(keyStr, trace, pt, layoutFont) { +exports.getInsideTextFontKey = function(keyStr, trace, pt, layoutFont, opts) { + var onPathbar = (opts || {}).onPathbar; + var cont = onPathbar ? 'pathbar.textfont' : 'insidetextfont'; var ptNumber = pt.data.data.i; return ( - Lib.castOption(trace, ptNumber, 'insidetextfont.' + keyStr) || + Lib.castOption(trace, ptNumber, cont + '.' + keyStr) || Lib.castOption(trace, ptNumber, 'textfont.' + keyStr) || layoutFont.size ); @@ -127,10 +134,10 @@ exports.isOutsideText = function(trace, pt) { return !trace._hasColorscale && exports.isHierarchyRoot(pt); }; -exports.determineTextFont = function(trace, pt, layoutFont, cont) { +exports.determineTextFont = function(trace, pt, layoutFont, opts) { return exports.isOutsideText(trace, pt) ? determineOutsideTextFont(trace, pt, layoutFont) : - determineInsideTextFont(trace, pt, layoutFont, cont); + determineInsideTextFont(trace, pt, layoutFont, opts); }; exports.hasTransition = function(transitionOpts) { diff --git a/src/traces/sunburst/plot.js b/src/traces/sunburst/plot.js index f87a0df82be..ef3616e4b88 100644 --- a/src/traces/sunburst/plot.js +++ b/src/traces/sunburst/plot.js @@ -14,12 +14,14 @@ var d3Hierarchy = require('d3-hierarchy'); var Drawing = require('../../components/drawing'); var Lib = require('../../lib'); var svgTextUtils = require('../../lib/svg_text_utils'); -var recordMinTextSize = require('../bar/plot').recordMinTextSize; +var uniformText = require('../bar/uniform_text'); +var recordMinTextSize = uniformText.recordMinTextSize; +var clearMinTextSize = uniformText.clearMinTextSize; var piePlot = require('../pie/plot'); var computeTransform = piePlot.computeTransform; var transformInsideText = piePlot.transformInsideText; var styleOne = require('./style').styleOne; - +var resizeText = require('../bar/style').resizeText; var attachFxHandlers = require('./fx'); var constants = require('./constants'); var helpers = require('./helpers'); @@ -32,7 +34,9 @@ exports.plot = function(gd, cdmodule, transitionOpts, makeOnCompleteCallback) { // If transition config is provided, then it is only a partial replot and traces not // updated are removed. var isFullReplot = !transitionOpts; - var hasTransition = helpers.hasTransition(transitionOpts); + var hasTransition = !fullLayout.uniformtext.mode && helpers.hasTransition(transitionOpts); + + clearMinTextSize('sunburst', fullLayout); join = layer.selectAll('g.trace.sunburst') .data(cdmodule, function(cd) { return cd[0].trace.uid; }); @@ -70,6 +74,10 @@ exports.plot = function(gd, cdmodule, transitionOpts, makeOnCompleteCallback) { join.each(function(cd) { plotOne(gd, cd, this, transitionOpts); }); + + if(fullLayout.uniformtext.mode) { + resizeText(gd, fullLayout._sunburstlayer.selectAll('.trace'), 'sunburst'); + } } if(isFullReplot) { @@ -79,7 +87,7 @@ exports.plot = function(gd, cdmodule, transitionOpts, makeOnCompleteCallback) { function plotOne(gd, cd, element, transitionOpts) { var fullLayout = gd._fullLayout; - var hasTransition = helpers.hasTransition(transitionOpts); + var hasTransition = !fullLayout.uniformtext.mode && helpers.hasTransition(transitionOpts); var gTrace = d3.select(element); var slices = gTrace.selectAll('g.slice'); diff --git a/src/traces/sunburst/style.js b/src/traces/sunburst/style.js index 16fef246ad0..6646167c170 100644 --- a/src/traces/sunburst/style.js +++ b/src/traces/sunburst/style.js @@ -11,7 +11,7 @@ var d3 = require('d3'); var Color = require('../../components/color'); var Lib = require('../../lib'); -var resizeText = require('../bar/style').resizeText; +var resizeText = require('../bar/uniform_text').resizeText; function style(gd) { var s = gd._fullLayout._sunburstlayer.selectAll('.trace'); diff --git a/src/traces/treemap/defaults.js b/src/traces/treemap/defaults.js index 8e14bd0ddbb..017fe0a6013 100644 --- a/src/traces/treemap/defaults.js +++ b/src/traces/treemap/defaults.js @@ -57,8 +57,11 @@ module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout coerce('hovertext'); coerce('hovertemplate'); + var hasPathbar = coerce('pathbar.visible'); + var textposition = 'auto'; handleText(traceIn, traceOut, layout, coerce, textposition, { + hasPathbar: hasPathbar, moduleHasSelected: false, moduleHasUnselected: false, moduleHasConstrain: false, @@ -73,7 +76,10 @@ module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout if(lineWidth) coerce('marker.line.color', layout.paper_bgcolor); var colors = coerce('marker.colors'); - var withColorscale = traceOut._hasColorscale = hasColorscale(traceIn, 'marker', 'colors'); + var withColorscale = traceOut._hasColorscale = ( + hasColorscale(traceIn, 'marker', 'colors') || + (traceIn.marker || {}).coloraxis // N.B. special logic to consider "values" colorscales + ); if(withColorscale) { colorscaleDefaults(traceIn, traceOut, layout, coerce, {prefix: 'marker.', cLetter: 'c'}); } else { @@ -100,10 +106,7 @@ module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout } }; - var hasPathbar = coerce('pathbar.visible'); if(hasPathbar) { - Lib.coerceFont(coerce, 'pathbar.textfont', layout.font); - // This works even for multi-line labels as treemap pathbar trim out line breaks coerce('pathbar.thickness', traceOut.pathbar.textfont.size + 2 * TEXTPAD); diff --git a/src/traces/treemap/draw_ancestors.js b/src/traces/treemap/draw_ancestors.js index a0db1d6b4d1..254cd077cac 100644 --- a/src/traces/treemap/draw_ancestors.js +++ b/src/traces/treemap/draw_ancestors.js @@ -97,7 +97,7 @@ module.exports = function drawAncestors(gd, cd, entry, slices, opts) { } updateSlices.each(function(pt) { - pt._hoverX = viewX(pt.x1 - height / 2); + pt._hoverX = viewX(pt.x1 - Math.min(width, height) / 2); pt._hoverY = viewY(pt.y1 - height / 2); var sliceTop = d3.select(this); @@ -141,7 +141,9 @@ module.exports = function drawAncestors(gd, cd, entry, slices, opts) { s.attr('data-notex', 1); }); - var font = Lib.ensureUniformFontSize(gd, helpers.determineTextFont(trace, pt, fullLayout.font, trace.pathdir)); + var font = Lib.ensureUniformFontSize(gd, helpers.determineTextFont(trace, pt, fullLayout.font, { + onPathbar: true + })); sliceText.text(pt._text || ' ') // use one space character instead of a blank string to avoid jumps during transition .classed('slicetext', true) @@ -151,22 +153,11 @@ module.exports = function drawAncestors(gd, cd, entry, slices, opts) { pt.textBB = Drawing.bBox(sliceText.node()); pt.transform = toMoveInsideSlice(pt, { + fontSize: font.size, onPathbar: true }); - pt.transform.fontSize = font.size; - if(helpers.isOutsideText(trace, pt)) { - // consider in/out diff font sizes - var outsideFont = helpers.getOutsideTextFontKey('size', trace, pt, fullLayout.font); - var insideFont = helpers.getInsideTextFontKey('size', trace, pt, fullLayout.font); - - var diffFontSize = outsideFont - insideFont; - - pt.transform.targetY -= diffFontSize; - pt.transform.fontSize -= diffFontSize; - } - if(hasTransition) { sliceText.transition().attrTween('transform', function(pt2) { var interp = makeUpdateTextInterpolator(pt2, onPathbar, refRect, [width, height]); diff --git a/src/traces/treemap/draw_descendants.js b/src/traces/treemap/draw_descendants.js index e589000916a..782a6a18899 100644 --- a/src/traces/treemap/draw_descendants.js +++ b/src/traces/treemap/draw_descendants.js @@ -192,6 +192,7 @@ module.exports = function drawDescendants(gd, cd, entry, slices, opts) { pt.textBB = Drawing.bBox(sliceText.node()); pt.transform = toMoveInsideSlice(pt, { + fontSize: font.size, isHeader: isHeader }); pt.transform.fontSize = font.size; diff --git a/src/traces/treemap/plot.js b/src/traces/treemap/plot.js index d2e1c2185ce..10f2a4d3523 100644 --- a/src/traces/treemap/plot.js +++ b/src/traces/treemap/plot.js @@ -10,15 +10,16 @@ var d3 = require('d3'); -var hasTransition = require('../sunburst/helpers').hasTransition; var helpers = require('../sunburst/helpers'); var Lib = require('../../lib'); var TEXTPAD = require('../bar/constants').TEXTPAD; var barPlot = require('../bar/plot'); var toMoveInsideBar = barPlot.toMoveInsideBar; -var recordMinTextSize = barPlot.recordMinTextSize; - +var uniformText = require('../bar/uniform_text'); +var recordMinTextSize = uniformText.recordMinTextSize; +var clearMinTextSize = uniformText.clearMinTextSize; +var resizeText = require('../bar/style').resizeText; var constants = require('./constants'); var drawDescendants = require('./draw_descendants'); var drawAncestors = require('./draw_ancestors'); @@ -32,6 +33,8 @@ module.exports = function(gd, cdmodule, transitionOpts, makeOnCompleteCallback) // updated are removed. var isFullReplot = !transitionOpts; + clearMinTextSize('treemap', fullLayout); + join = layer.selectAll('g.trace.treemap') .data(cdmodule, function(cd) { return cd[0].trace.uid; }); @@ -41,7 +44,7 @@ module.exports = function(gd, cdmodule, transitionOpts, makeOnCompleteCallback) join.order(); - if(hasTransition(transitionOpts)) { + if(!fullLayout.uniformtext.mode && helpers.hasTransition(transitionOpts)) { if(makeOnCompleteCallback) { // If it was passed a callback to register completion, make a callback. If // this is created, then it must be executed on completion, otherwise the @@ -66,6 +69,10 @@ module.exports = function(gd, cdmodule, transitionOpts, makeOnCompleteCallback) join.each(function(cd) { plotOne(gd, cd, this, transitionOpts); }); + + if(fullLayout.uniformtext.mode) { + resizeText(gd, fullLayout._treemaplayer.selectAll('.trace'), 'treemap'); + } } if(isFullReplot) { @@ -97,7 +104,7 @@ function plotOne(gd, cd, element, transitionOpts) { } var isRoot = helpers.isHierarchyRoot(entry); - var hasTransition = helpers.hasTransition(transitionOpts); + var hasTransition = !fullLayout.uniformtext.mode && helpers.hasTransition(transitionOpts); var maxDepth = helpers.getMaxDepth(trace); var hasVisibleDepth = function(pt) { @@ -351,6 +358,7 @@ function plotOne(gd, cd, element, transitionOpts) { angle: 0, anchor: anchor }); + transform.fontSize = opts.fontSize; if(offsetDir !== 'center') { var deltaX = (x1 - x0) / 2 - transform.scale * (textBB.right - textBB.left) / 2; @@ -360,8 +368,10 @@ function plotOne(gd, cd, element, transitionOpts) { else if(offsetDir === 'right') transform.targetX += deltaX; } - transform.targetX = viewMapX(transform.targetX); - transform.targetY = viewMapY(transform.targetY); + transform.targetX = viewMapX(transform.targetX - transform.anchorX * transform.scale); + transform.targetY = viewMapY(transform.targetY - transform.anchorY * transform.scale); + transform.anchorX = 0; + transform.anchorY = 0; if(isNaN(transform.targetX) || isNaN(transform.targetY)) { return {}; diff --git a/src/traces/treemap/style.js b/src/traces/treemap/style.js index f3ec784b934..18803bb8a25 100644 --- a/src/traces/treemap/style.js +++ b/src/traces/treemap/style.js @@ -12,7 +12,7 @@ var d3 = require('d3'); var Color = require('../../components/color'); var Lib = require('../../lib'); var helpers = require('../sunburst/helpers'); -var resizeText = require('../bar/style').resizeText; +var resizeText = require('../bar/uniform_text').resizeText; function style(gd) { var s = gd._fullLayout._treemaplayer.selectAll('.trace'); diff --git a/src/traces/waterfall/plot.js b/src/traces/waterfall/plot.js index c1e45f1735c..006bc9e93aa 100644 --- a/src/traces/waterfall/plot.js +++ b/src/traces/waterfall/plot.js @@ -11,12 +11,15 @@ var d3 = require('d3'); var Lib = require('../../lib'); var Drawing = require('../../components/drawing'); -var barPlot = require('../bar/plot').plot; +var barPlot = require('../bar/plot'); +var clearMinTextSize = require('../bar/uniform_text').clearMinTextSize; module.exports = function plot(gd, plotinfo, cdModule, traceLayer) { var fullLayout = gd._fullLayout; - barPlot(gd, plotinfo, cdModule, traceLayer, { + clearMinTextSize('waterfall', fullLayout); + + barPlot.plot(gd, plotinfo, cdModule, traceLayer, { mode: fullLayout.waterfallmode, norm: fullLayout.waterfallmode, gap: fullLayout.waterfallgap, diff --git a/src/traces/waterfall/style.js b/src/traces/waterfall/style.js index ff802b4b007..388d632e16b 100644 --- a/src/traces/waterfall/style.js +++ b/src/traces/waterfall/style.js @@ -14,7 +14,7 @@ var Drawing = require('../../components/drawing'); var Color = require('../../components/color'); var DESELECTDIM = require('../../constants/interactions').DESELECTDIM; var barStyle = require('../bar/style'); -var resizeText = barStyle.resizeText; +var resizeText = require('../bar/uniform_text').resizeText; var styleTextPoints = barStyle.styleTextPoints; function style(gd, cd, sel) { diff --git a/test/image/baselines/bar-like_textangle45.png b/test/image/baselines/bar-like_textangle45.png new file mode 100644 index 00000000000..57303f2fc17 Binary files /dev/null and b/test/image/baselines/bar-like_textangle45.png differ diff --git a/test/image/baselines/bar-like_textangle60.png b/test/image/baselines/bar-like_textangle60.png new file mode 100644 index 00000000000..8e00cbd63ae Binary files /dev/null and b/test/image/baselines/bar-like_textangle60.png differ diff --git a/test/image/baselines/funnel_axis_textangle.png b/test/image/baselines/funnel_axis_textangle.png index 171e64944b1..cb57ec44c4c 100644 Binary files a/test/image/baselines/funnel_axis_textangle.png and b/test/image/baselines/funnel_axis_textangle.png differ diff --git a/test/image/baselines/funnel_axis_textangle_start-end.png b/test/image/baselines/funnel_axis_textangle_start-end.png index ae7bd9d62ad..7558561ad50 100644 Binary files a/test/image/baselines/funnel_axis_textangle_start-end.png and b/test/image/baselines/funnel_axis_textangle_start-end.png differ diff --git a/test/image/baselines/treemap_fonts_nocolor.png b/test/image/baselines/treemap_fonts_nocolor.png new file mode 100644 index 00000000000..2fcdefdb3a9 Binary files /dev/null and b/test/image/baselines/treemap_fonts_nocolor.png differ diff --git a/test/image/baselines/treemap_fonts_withcolor.png b/test/image/baselines/treemap_fonts_withcolor.png new file mode 100644 index 00000000000..e8051271977 Binary files /dev/null and b/test/image/baselines/treemap_fonts_withcolor.png differ diff --git a/test/image/baselines/treemap_packings.png b/test/image/baselines/treemap_packings.png index bf3d590fd6c..2891ea6cb32 100644 Binary files a/test/image/baselines/treemap_packings.png and b/test/image/baselines/treemap_packings.png differ diff --git a/test/image/baselines/treemap_textposition.png b/test/image/baselines/treemap_textposition.png index 7b435acc2cb..67835c5498c 100644 Binary files a/test/image/baselines/treemap_textposition.png and b/test/image/baselines/treemap_textposition.png differ diff --git a/test/image/baselines/uniformtext_bar-like_10_auto.png b/test/image/baselines/uniformtext_bar-like_10_auto.png index b3af71c55e4..015b335e066 100644 Binary files a/test/image/baselines/uniformtext_bar-like_10_auto.png and b/test/image/baselines/uniformtext_bar-like_10_auto.png differ diff --git a/test/image/baselines/uniformtext_bar-like_8_horizontal.png b/test/image/baselines/uniformtext_bar-like_8_horizontal.png index 9066539beed..ea1b416f25d 100644 Binary files a/test/image/baselines/uniformtext_bar-like_8_horizontal.png and b/test/image/baselines/uniformtext_bar-like_8_horizontal.png differ diff --git a/test/image/baselines/uniformtext_bar-like_8_textangle.png b/test/image/baselines/uniformtext_bar-like_8_textangle.png index 70382642b5a..01f99d0faa1 100644 Binary files a/test/image/baselines/uniformtext_bar-like_8_textangle.png and b/test/image/baselines/uniformtext_bar-like_8_textangle.png differ diff --git a/test/image/baselines/uniformtext_bar-like_8_textangle45.png b/test/image/baselines/uniformtext_bar-like_8_textangle45.png new file mode 100644 index 00000000000..5a669beb90d Binary files /dev/null and b/test/image/baselines/uniformtext_bar-like_8_textangle45.png differ diff --git a/test/image/baselines/uniformtext_bar_axis_textangle_inside.png b/test/image/baselines/uniformtext_bar_axis_textangle_inside.png new file mode 100644 index 00000000000..d175202e6bb Binary files /dev/null and b/test/image/baselines/uniformtext_bar_axis_textangle_inside.png differ diff --git a/test/image/baselines/uniformtext_bar_axis_textangle_outside.png b/test/image/baselines/uniformtext_bar_axis_textangle_outside.png new file mode 100644 index 00000000000..ed6b9b407e0 Binary files /dev/null and b/test/image/baselines/uniformtext_bar_axis_textangle_outside.png differ diff --git a/test/image/baselines/uniformtext_bar_edgecase2.png b/test/image/baselines/uniformtext_bar_edgecase2.png index 9fed91ea3c3..11bafc8ab9d 100644 Binary files a/test/image/baselines/uniformtext_bar_edgecase2.png and b/test/image/baselines/uniformtext_bar_edgecase2.png differ diff --git a/test/image/baselines/uniformtext_bar_edgecase3.png b/test/image/baselines/uniformtext_bar_edgecase3.png index d71ced1c2ca..3a50b02f0a1 100644 Binary files a/test/image/baselines/uniformtext_bar_edgecase3.png and b/test/image/baselines/uniformtext_bar_edgecase3.png differ diff --git a/test/image/baselines/uniformtext_bar_edgecase4.png b/test/image/baselines/uniformtext_bar_edgecase4.png new file mode 100644 index 00000000000..f4ecc53f03d Binary files /dev/null and b/test/image/baselines/uniformtext_bar_edgecase4.png differ diff --git a/test/image/baselines/uniformtext_bar_edgecase5.png b/test/image/baselines/uniformtext_bar_edgecase5.png new file mode 100644 index 00000000000..afe4eed1de7 Binary files /dev/null and b/test/image/baselines/uniformtext_bar_edgecase5.png differ diff --git a/test/image/baselines/uniformtext_bar_edgecase6.png b/test/image/baselines/uniformtext_bar_edgecase6.png new file mode 100644 index 00000000000..a9839a77c5f Binary files /dev/null and b/test/image/baselines/uniformtext_bar_edgecase6.png differ diff --git a/test/image/baselines/uniformtext_bar_edgecase7.png b/test/image/baselines/uniformtext_bar_edgecase7.png new file mode 100644 index 00000000000..b2b854b9f66 Binary files /dev/null and b/test/image/baselines/uniformtext_bar_edgecase7.png differ diff --git a/test/image/baselines/uniformtext_bar_edgecase8.png b/test/image/baselines/uniformtext_bar_edgecase8.png new file mode 100644 index 00000000000..a8f7c9abecf Binary files /dev/null and b/test/image/baselines/uniformtext_bar_edgecase8.png differ diff --git a/test/image/baselines/uniformtext_sunburst_treemap.png b/test/image/baselines/uniformtext_sunburst_treemap.png index eb00334ba3e..96d3d7227a3 100644 Binary files a/test/image/baselines/uniformtext_sunburst_treemap.png and b/test/image/baselines/uniformtext_sunburst_treemap.png differ diff --git a/test/image/baselines/uniformtext_treemap.png b/test/image/baselines/uniformtext_treemap.png new file mode 100644 index 00000000000..43723137e15 Binary files /dev/null and b/test/image/baselines/uniformtext_treemap.png differ diff --git a/test/image/mocks/bar-like_textangle45.json b/test/image/mocks/bar-like_textangle45.json new file mode 100644 index 00000000000..421ed9867ba --- /dev/null +++ b/test/image/mocks/bar-like_textangle45.json @@ -0,0 +1,210 @@ +{ + "data": [ + { + "y": [ + 4, + 1, + 0.5 + ], + "text": [ + "very
L
O
N
G
text", + "text", + "invisible" + ], + "type": "bar", + "textinfo": "text", + "textposition": "auto", + "textangle": -45, + "xaxis": "x1", + "yaxis": "y1" + }, + { + "y": [ + 4, + 1, + 0.5 + ], + "text": [ + "very L O N G text", + "text", + "visible" + ], + "type": "bar", + "textinfo": "text", + "textposition": "auto", + "textangle": -45, + "xaxis": "x1", + "yaxis": "y1" + }, + { + "y": [ + 4, + 1, + 0.5 + ], + "text": [ + "very
L
O
N
G
text", + "text", + "invisible" + ], + "type": "bar", + "textinfo": "text", + "textposition": "inside", + "textangle": -45, + "xaxis": "x2", + "yaxis": "y2" + }, + { + "y": [ + 4, + 1, + 0.5 + ], + "text": [ + "very L O N G text", + "text", + "invisible" + ], + "type": "bar", + "textinfo": "text", + "textposition": "inside", + "textangle": -45, + "xaxis": "x2", + "yaxis": "y2" + }, + { + "y": [ + 5, + 1, + 0.5 + ], + "text": [ + "very
L
O
N
G
text", + "text", + "invisible" + ], + "type": "funnel", + "textinfo": "text", + "textposition": "inside", + "textangle": -45, + "xaxis": "x3", + "yaxis": "y3" + }, + { + "y": [ + 3, + 1, + 0.5 + ], + "text": [ + "very L O N G text", + "text", + "invisible" + ], + "type": "funnel", + "textinfo": "text", + "textposition": "inside", + "textangle": -45, + "xaxis": "x3", + "yaxis": "y3" + }, + { + "y": [ + 4, + -0.5, + 0.25, + null + ], + "measure": [ + "", + "", + "", + "total" + ], + "text": [ + "very L O N G text", + "text", + "invisible", + "very
L
O
N
G
text" + ], + "type": "waterfall", + "textinfo": "text", + "textposition": "inside", + "insidetextanchor": "middle", + "textangle": -45, + "xaxis": "x4", + "yaxis": "y4" + } + ], + "layout": { + "width": 800, + "height": 500, + "margin": { + "t": 20, + "b": 20, + "l": 20, + "r": 20 + }, + "legend": { + "orientation": "h", + "title": { + "text": "bar, funnel & waterfall
textangle:-45" + } + }, + "barmode": "stack", + "xaxis": { + "domain": [ + 0, + 0.48 + ] + }, + "xaxis2": { + "anchor": "y2", + "domain": [ + 0, + 0.48 + ] + }, + "xaxis3": { + "anchor": "y3", + "domain": [ + 0.52, + 1 + ] + }, + "xaxis4": { + "anchor": "y4", + "domain": [ + 0.52, + 1 + ] + }, + "yaxis": { + "domain": [ + 0, + 0.48 + ] + }, + "yaxis2": { + "anchor": "x2", + "domain": [ + 0.52, + 1 + ] + }, + "yaxis3": { + "anchor": "x3", + "domain": [ + 0.52, + 1 + ] + }, + "yaxis4": { + "anchor": "x4", + "domain": [ + 0, + 0.48 + ] + } + } +} diff --git a/test/image/mocks/bar-like_textangle60.json b/test/image/mocks/bar-like_textangle60.json new file mode 100644 index 00000000000..662e01818ef --- /dev/null +++ b/test/image/mocks/bar-like_textangle60.json @@ -0,0 +1,210 @@ +{ + "data": [ + { + "y": [ + 4, + 1, + 0.5 + ], + "text": [ + "very
L
O
N
G
text", + "text", + "invisible" + ], + "type": "bar", + "textinfo": "text", + "textposition": "auto", + "textangle": -60, + "xaxis": "x1", + "yaxis": "y1" + }, + { + "y": [ + 4, + 1, + 0.5 + ], + "text": [ + "very L O N G text", + "text", + "visible" + ], + "type": "bar", + "textinfo": "text", + "textposition": "auto", + "textangle": -60, + "xaxis": "x1", + "yaxis": "y1" + }, + { + "y": [ + 4, + 1, + 0.5 + ], + "text": [ + "very
L
O
N
G
text", + "text", + "invisible" + ], + "type": "bar", + "textinfo": "text", + "textposition": "inside", + "textangle": -60, + "xaxis": "x2", + "yaxis": "y2" + }, + { + "y": [ + 4, + 1, + 0.5 + ], + "text": [ + "very L O N G text", + "text", + "invisible" + ], + "type": "bar", + "textinfo": "text", + "textposition": "inside", + "textangle": -60, + "xaxis": "x2", + "yaxis": "y2" + }, + { + "y": [ + 5, + 1, + 0.5 + ], + "text": [ + "very
L
O
N
G
text", + "text", + "invisible" + ], + "type": "funnel", + "textinfo": "text", + "textposition": "inside", + "textangle": -60, + "xaxis": "x3", + "yaxis": "y3" + }, + { + "y": [ + 3, + 1, + 0.5 + ], + "text": [ + "very L O N G text", + "text", + "invisible" + ], + "type": "funnel", + "textinfo": "text", + "textposition": "inside", + "textangle": -60, + "xaxis": "x3", + "yaxis": "y3" + }, + { + "y": [ + 4, + -0.5, + 0.25, + null + ], + "measure": [ + "", + "", + "", + "total" + ], + "text": [ + "very L O N G text", + "text", + "invisible", + "very
L
O
N
G
text" + ], + "type": "waterfall", + "textinfo": "text", + "textposition": "inside", + "insidetextanchor": "middle", + "textangle": -60, + "xaxis": "x4", + "yaxis": "y4" + } + ], + "layout": { + "width": 800, + "height": 500, + "margin": { + "t": 20, + "b": 20, + "l": 20, + "r": 20 + }, + "legend": { + "orientation": "h", + "title": { + "text": "bar, funnel & waterfall
textangle:-60" + } + }, + "barmode": "stack", + "xaxis": { + "domain": [ + 0, + 0.48 + ] + }, + "xaxis2": { + "anchor": "y2", + "domain": [ + 0, + 0.48 + ] + }, + "xaxis3": { + "anchor": "y3", + "domain": [ + 0.52, + 1 + ] + }, + "xaxis4": { + "anchor": "y4", + "domain": [ + 0.52, + 1 + ] + }, + "yaxis": { + "domain": [ + 0, + 0.48 + ] + }, + "yaxis2": { + "anchor": "x2", + "domain": [ + 0.52, + 1 + ] + }, + "yaxis3": { + "anchor": "x3", + "domain": [ + 0.52, + 1 + ] + }, + "yaxis4": { + "anchor": "x4", + "domain": [ + 0, + 0.48 + ] + } + } +} diff --git a/test/image/mocks/treemap_fonts_nocolor.json b/test/image/mocks/treemap_fonts_nocolor.json new file mode 100644 index 00000000000..baa4c1ac87c --- /dev/null +++ b/test/image/mocks/treemap_fonts_nocolor.json @@ -0,0 +1,331 @@ +{ + "data": [ + { + "type": "treemap", "tiling": { "packing": "slice" }, + "level": "Oscar", + "parents": [ + "", + "Alpha", + "Alpha", + "Charlie", + "Charlie", + "Charlie", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform" + ], + "labels": [ + "Alpha", + "Bravo", + "Charlie", + "Delta", + "Echo", + "Foxtrot", + "Golf", + "Hotel", + "India", + "Juliet", + "Kilo", + "Lima", + "Mike", + "November", + "Oscar", + "Papa", + "Quebec", + "Romeo", + "Sierra", + "Tango", + "Uniform", + "Victor", + "Whiskey", + "X ray", + "Yankee", + "Zulu" + ], + "textinfo": "label", + "domain": { + "x": [ + 0.52, + 0.98 + ], + "y": [ + 0.52, + 0.98 + ] + } + }, + { + "type": "treemap", "tiling": { "packing": "slice" }, + "level": "Oscar", + "parents": [ + "", + "Alpha", + "Alpha", + "Charlie", + "Charlie", + "Charlie", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform" + ], + "labels": [ + "Alpha", + "Bravo", + "Charlie", + "Delta", + "Echo", + "Foxtrot", + "Golf", + "Hotel", + "India", + "Juliet", + "Kilo", + "Lima", + "Mike", + "November", + "Oscar", + "Papa", + "Quebec", + "Romeo", + "Sierra", + "Tango", + "Uniform", + "Victor", + "Whiskey", + "X ray", + "Yankee", + "Zulu" + ], + "textinfo": "label", + "textfont": { + "family": "Raleway, sans-serif", + "color": "#007", + "size": 15 + }, + "domain": { + "x": [ + 0.52, + 0.98 + ], + "y": [ + 0.02, + 0.48 + ] + } + }, + { + "type": "treemap", "tiling": { "packing": "slice" }, + "level": "Oscar", + "parents": [ + "", + "Alpha", + "Alpha", + "Charlie", + "Charlie", + "Charlie", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform" + ], + "labels": [ + "Alpha", + "Bravo", + "Charlie", + "Delta", + "Echo", + "Foxtrot", + "Golf", + "Hotel", + "India", + "Juliet", + "Kilo", + "Lima", + "Mike", + "November", + "Oscar", + "Papa", + "Quebec", + "Romeo", + "Sierra", + "Tango", + "Uniform", + "Victor", + "Whiskey", + "X ray", + "Yankee", + "Zulu" + ], + "textinfo": "label", + "insidetextfont": { + "family": "Courier New, monospace", + "color": "#000", + "size": 10 + }, + "pathbar": { + "textfont": { + "family": "Times New Roman, Times, serif", + "color": "#FF0", + "size": 20 + } + }, + "domain": { + "x": [ + 0.02, + 0.48 + ], + "y": [ + 0.02, + 0.48 + ] + } + }, + { + "type": "treemap", "tiling": { "packing": "slice" }, + "level": "Oscar", + "parents": [ + "", + "Alpha", + "Alpha", + "Charlie", + "Charlie", + "Charlie", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform" + ], + "labels": [ + "Alpha", + "Bravo", + "Charlie", + "Delta", + "Echo", + "Foxtrot", + "Golf", + "Hotel", + "India", + "Juliet", + "Kilo", + "Lima", + "Mike", + "November", + "Oscar", + "Papa", + "Quebec", + "Romeo", + "Sierra", + "Tango", + "Uniform", + "Victor", + "Whiskey", + "X ray", + "Yankee", + "Zulu" + ], + "textinfo": "label", + "insidetextfont": { + "family": "Times New Roman, Times, serif", + "color": "#FF0", + "size": 20 + }, + "pathbar": { + "textfont": { + "family": "Courier New, monospace", + "color": "#000", + "size": 10 + } + }, + "domain": { + "x": [ + 0.02, + 0.48 + ], + "y": [ + 0.52, + 0.98 + ] + } + } + ], + "layout": { + "width": 800, + "height": 800, + "margin": { + "t": 10, + "b": 10, + "l": 10, + "r": 10 + } + } +} diff --git a/test/image/mocks/treemap_fonts_withcolor.json b/test/image/mocks/treemap_fonts_withcolor.json new file mode 100644 index 00000000000..29b1e7a077e --- /dev/null +++ b/test/image/mocks/treemap_fonts_withcolor.json @@ -0,0 +1,348 @@ +{ + "data": [ + { + "marker": { + "coloraxis": "coloraxis" + }, + "type": "treemap", "tiling": { "packing": "slice" }, + "level": "Oscar", + "parents": [ + "", + "Alpha", + "Alpha", + "Charlie", + "Charlie", + "Charlie", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform" + ], + "labels": [ + "Alpha", + "Bravo", + "Charlie", + "Delta", + "Echo", + "Foxtrot", + "Golf", + "Hotel", + "India", + "Juliet", + "Kilo", + "Lima", + "Mike", + "November", + "Oscar", + "Papa", + "Quebec", + "Romeo", + "Sierra", + "Tango", + "Uniform", + "Victor", + "Whiskey", + "X ray", + "Yankee", + "Zulu" + ], + "textinfo": "label", + "domain": { + "x": [ + 0.52, + 0.98 + ], + "y": [ + 0.52, + 0.98 + ] + } + }, + { + "marker": { + "coloraxis": "coloraxis" + }, + "type": "treemap", "tiling": { "packing": "slice" }, + "level": "Oscar", + "parents": [ + "", + "Alpha", + "Alpha", + "Charlie", + "Charlie", + "Charlie", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform" + ], + "labels": [ + "Alpha", + "Bravo", + "Charlie", + "Delta", + "Echo", + "Foxtrot", + "Golf", + "Hotel", + "India", + "Juliet", + "Kilo", + "Lima", + "Mike", + "November", + "Oscar", + "Papa", + "Quebec", + "Romeo", + "Sierra", + "Tango", + "Uniform", + "Victor", + "Whiskey", + "X ray", + "Yankee", + "Zulu" + ], + "textinfo": "label", + "textfont": { + "family": "Raleway, sans-serif", + "color": "#FFF", + "size": 15 + }, + "domain": { + "x": [ + 0.52, + 0.98 + ], + "y": [ + 0.02, + 0.48 + ] + } + }, + { + "marker": { + "coloraxis": "coloraxis" + }, + "type": "treemap", "tiling": { "packing": "slice" }, + "level": "Oscar", + "parents": [ + "", + "Alpha", + "Alpha", + "Charlie", + "Charlie", + "Charlie", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform" + ], + "labels": [ + "Alpha", + "Bravo", + "Charlie", + "Delta", + "Echo", + "Foxtrot", + "Golf", + "Hotel", + "India", + "Juliet", + "Kilo", + "Lima", + "Mike", + "November", + "Oscar", + "Papa", + "Quebec", + "Romeo", + "Sierra", + "Tango", + "Uniform", + "Victor", + "Whiskey", + "X ray", + "Yankee", + "Zulu" + ], + "textinfo": "label", + "insidetextfont": { + "family": "Courier New, monospace", + "color": "#000", + "size": 10 + }, + "pathbar": { + "textfont": { + "family": "Times New Roman, Times, serif", + "color": "#FF0", + "size": 20 + } + }, + "domain": { + "x": [ + 0.02, + 0.48 + ], + "y": [ + 0.02, + 0.48 + ] + } + }, + { + "marker": { + "coloraxis": "coloraxis" + }, + "type": "treemap", "tiling": { "packing": "slice" }, + "level": "Oscar", + "parents": [ + "", + "Alpha", + "Alpha", + "Charlie", + "Charlie", + "Charlie", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform" + ], + "labels": [ + "Alpha", + "Bravo", + "Charlie", + "Delta", + "Echo", + "Foxtrot", + "Golf", + "Hotel", + "India", + "Juliet", + "Kilo", + "Lima", + "Mike", + "November", + "Oscar", + "Papa", + "Quebec", + "Romeo", + "Sierra", + "Tango", + "Uniform", + "Victor", + "Whiskey", + "X ray", + "Yankee", + "Zulu" + ], + "textinfo": "label", + "insidetextfont": { + "family": "Times New Roman, Times, serif", + "color": "#FF0", + "size": 20 + }, + "pathbar": { + "textfont": { + "family": "Courier New, monospace", + "color": "#000", + "size": 10 + } + }, + "domain": { + "x": [ + 0.02, + 0.48 + ], + "y": [ + 0.52, + 0.98 + ] + } + } + ], + "layout": { + "coloraxis": { + "colorscale": "Portland", + "reversescale": true, + "showscale": false + }, + "width": 800, + "height": 800, + "margin": { + "t": 10, + "b": 10, + "l": 10, + "r": 10 + } + } +} diff --git a/test/image/mocks/treemap_textfit.json b/test/image/mocks/treemap_textfit.json index f9ee8c98f21..8770f34a969 100644 --- a/test/image/mocks/treemap_textfit.json +++ b/test/image/mocks/treemap_textfit.json @@ -6,6 +6,11 @@ "packing": "squarify", "pad": 2 }, + "pathbar": { + "textfont": { + "size": 12 + } + }, "textfont": { "size": 256 }, diff --git a/test/image/mocks/uniformtext_bar-like_10_auto.json b/test/image/mocks/uniformtext_bar-like_10_auto.json index 8a959962d28..1b765ae9170 100644 --- a/test/image/mocks/uniformtext_bar-like_10_auto.json +++ b/test/image/mocks/uniformtext_bar-like_10_auto.json @@ -124,7 +124,6 @@ "type": "waterfall", "textinfo": "text", "textposition": "inside", - "insidetextanchor": "middle", "xaxis": "x4", "yaxis": "y4" } diff --git a/test/image/mocks/uniformtext_bar-like_8_horizontal.json b/test/image/mocks/uniformtext_bar-like_8_horizontal.json index b791df0d8a8..bdd6d026001 100644 --- a/test/image/mocks/uniformtext_bar-like_8_horizontal.json +++ b/test/image/mocks/uniformtext_bar-like_8_horizontal.json @@ -131,7 +131,6 @@ "textangle": 0, "textinfo": "text", "textposition": "inside", - "insidetextanchor": "middle", "xaxis": "x4", "yaxis": "y4" } diff --git a/test/image/mocks/uniformtext_bar-like_8_textangle.json b/test/image/mocks/uniformtext_bar-like_8_textangle.json index a66d1de8ff0..b2d11a01a5d 100644 --- a/test/image/mocks/uniformtext_bar-like_8_textangle.json +++ b/test/image/mocks/uniformtext_bar-like_8_textangle.json @@ -130,7 +130,6 @@ "type": "waterfall", "textinfo": "text", "textposition": "inside", - "insidetextanchor": "middle", "textangle": -90, "xaxis": "x4", "yaxis": "y4" diff --git a/test/image/mocks/uniformtext_bar-like_8_textangle45.json b/test/image/mocks/uniformtext_bar-like_8_textangle45.json new file mode 100644 index 00000000000..18ded75dd42 --- /dev/null +++ b/test/image/mocks/uniformtext_bar-like_8_textangle45.json @@ -0,0 +1,213 @@ +{ + "data": [ + { + "y": [ + 4, + 1, + 0.5 + ], + "text": [ + "very
L
O
N
G
text", + "text", + "invisible" + ], + "type": "bar", + "textinfo": "text", + "textposition": "auto", + "textangle": -45, + "xaxis": "x1", + "yaxis": "y1" + }, + { + "y": [ + 4, + 1, + 0.5 + ], + "text": [ + "very L O N G text", + "text", + "visible" + ], + "type": "bar", + "textinfo": "text", + "textposition": "auto", + "textangle": -45, + "xaxis": "x1", + "yaxis": "y1" + }, + { + "y": [ + 4, + 1, + 0.5 + ], + "text": [ + "very
L
O
N
G
text", + "text", + "invisible" + ], + "type": "bar", + "textinfo": "text", + "textposition": "inside", + "textangle": -45, + "xaxis": "x2", + "yaxis": "y2" + }, + { + "y": [ + 4, + 1, + 0.5 + ], + "text": [ + "very L O N G text", + "text", + "invisible" + ], + "type": "bar", + "textinfo": "text", + "textposition": "inside", + "textangle": -45, + "xaxis": "x2", + "yaxis": "y2" + }, + { + "y": [ + 5, + 1, + 0.5 + ], + "text": [ + "very
L
O
N
G
text", + "text", + "invisible" + ], + "type": "funnel", + "textinfo": "text", + "textposition": "inside", + "textangle": -45, + "xaxis": "x3", + "yaxis": "y3" + }, + { + "y": [ + 3, + 1, + 0.5 + ], + "text": [ + "very L O N G text", + "text", + "invisible" + ], + "type": "funnel", + "textinfo": "text", + "textposition": "inside", + "textangle": -45, + "xaxis": "x3", + "yaxis": "y3" + }, + { + "y": [ + 4, + -0.5, + 0.25, + null + ], + "measure": [ + "", + "", + "", + "total" + ], + "text": [ + "very L O N G text", + "text", + "invisible", + "very
L
O
N
G
text" + ], + "type": "waterfall", + "textinfo": "text", + "textposition": "inside", + "textangle": -45, + "xaxis": "x4", + "yaxis": "y4" + } + ], + "layout": { + "width": 800, + "height": 500, + "margin": { + "t": 20, + "b": 20, + "l": 20, + "r": 20 + }, + "legend": { + "orientation": "h", + "title": { + "text": "bar, funnel & waterfall uniform text
textangle:-45 | minsize=8" + } + }, + "uniformtext": { + "mode": "hide", + "minsize": 8 + }, + "barmode": "stack", + "xaxis": { + "domain": [ + 0, + 0.48 + ] + }, + "xaxis2": { + "anchor": "y2", + "domain": [ + 0, + 0.48 + ] + }, + "xaxis3": { + "anchor": "y3", + "domain": [ + 0.52, + 1 + ] + }, + "xaxis4": { + "anchor": "y4", + "domain": [ + 0.52, + 1 + ] + }, + "yaxis": { + "domain": [ + 0, + 0.48 + ] + }, + "yaxis2": { + "anchor": "x2", + "domain": [ + 0.52, + 1 + ] + }, + "yaxis3": { + "anchor": "x3", + "domain": [ + 0.52, + 1 + ] + }, + "yaxis4": { + "anchor": "x4", + "domain": [ + 0, + 0.48 + ] + } + } +} diff --git a/test/image/mocks/uniformtext_bar_axis_textangle_inside.json b/test/image/mocks/uniformtext_bar_axis_textangle_inside.json new file mode 100644 index 00000000000..7af170f7bad --- /dev/null +++ b/test/image/mocks/uniformtext_bar_axis_textangle_inside.json @@ -0,0 +1,165 @@ +{ + "data": [ + { + "type": "bar", + "orientation": "v", + "x": [ + "A", + "B", + "C" + ], + "y": [ + 3, + 2, + 1 + ], + "text": [ + "()", + "void main()", + "public static void main()" + ], + "textposition": "inside", + "cliponaxis": false, + "textangle": -15, + "textinfo": "value+percent initial+percent previous+percent total" + }, + { + "type": "bar", + "orientation": "v", + "x": [ + "A", + "B", + "C" + ], + "y": [ + 300, + 200, + 100 + ], + "text": [ + "()", + "void main()", + "public static void main()" + ], + "textposition": "inside", + "cliponaxis": false, + "textangle": 135, + "textinfo": "value+percent initial+percent previous+percent total", + "xaxis": "x2", + "yaxis": "y2" + }, + { + "type": "bar", + "orientation": "h", + "x": [ + 30000, + 20000, + 10000 + ], + "y": [ + "A", + "B", + "C" + ], + "text": [ + "()", + "void main()", + "public static void main()" + ], + "textposition": "inside", + "cliponaxis": false, + "textangle": 30, + "textinfo": "value+percent initial+percent previous+percent total", + "xaxis": "x3", + "yaxis": "y3" + }, + { + "type": "bar", + "orientation": "h", + "x": [ + 1000000, + 2000000, + 3000000 + ], + "y": [ + "A", + "B", + "C" + ], + "text": [ + "()", + "void main()", + "public static void main()" + ], + "textposition": "inside", + "cliponaxis": false, + "textangle": -90, + "textinfo": "value+percent initial+percent previous+percent total", + "xaxis": "x4", + "yaxis": "y4" + } + ], + "layout": { + "uniformtext": { + "mode": "hide", + "minsize": 10 + }, + "width": 800, + "height": 800, + "dragmode": "pan", + "xaxis": { + "domain": [ + 0, + 0.48 + ] + }, + "xaxis2": { + "anchor": "y2", + "domain": [ + 0.52, + 1 + ] + }, + "xaxis3": { + "anchor": "y3", + "domain": [ + 0, + 0.48 + ] + }, + "xaxis4": { + "anchor": "y4", + "domain": [ + 0.52, + 1 + ] + }, + "yaxis": { + "domain": [ + 0, + 0.48 + ] + }, + "yaxis2": { + "anchor": "x2", + "domain": [ + 0.52, + 1 + ] + }, + "yaxis3": { + "anchor": "x3", + "domain": [ + 0.52, + 1 + ] + }, + "yaxis4": { + "anchor": "x4", + "domain": [ + 0, + 0.48 + ] + } + } +} diff --git a/test/image/mocks/uniformtext_bar_axis_textangle_outside.json b/test/image/mocks/uniformtext_bar_axis_textangle_outside.json new file mode 100644 index 00000000000..f473ccc02a5 --- /dev/null +++ b/test/image/mocks/uniformtext_bar_axis_textangle_outside.json @@ -0,0 +1,165 @@ +{ + "data": [ + { + "type": "bar", + "orientation": "v", + "x": [ + "A", + "B", + "C" + ], + "y": [ + 3, + 2, + 1 + ], + "text": [ + "()", + "void main()", + "public static void main()" + ], + "textposition": "outside", + "cliponaxis": false, + "textangle": -15, + "textinfo": "value+percent initial+percent previous+percent total" + }, + { + "type": "bar", + "orientation": "v", + "x": [ + "A", + "B", + "C" + ], + "y": [ + 300, + 200, + 100 + ], + "text": [ + "()", + "void main()", + "public static void main()" + ], + "textposition": "outside", + "cliponaxis": false, + "textangle": 135, + "textinfo": "value+percent initial+percent previous+percent total", + "xaxis": "x2", + "yaxis": "y2" + }, + { + "type": "bar", + "orientation": "h", + "x": [ + 30000, + 20000, + 10000 + ], + "y": [ + "A", + "B", + "C" + ], + "text": [ + "()", + "void main()", + "public static void main()" + ], + "textposition": "outside", + "cliponaxis": false, + "textangle": 30, + "textinfo": "value+percent initial+percent previous+percent total", + "xaxis": "x3", + "yaxis": "y3" + }, + { + "type": "bar", + "orientation": "h", + "x": [ + 1000000, + 2000000, + 3000000 + ], + "y": [ + "A", + "B", + "C" + ], + "text": [ + "()", + "void main()", + "public static void main()" + ], + "textposition": "outside", + "cliponaxis": false, + "textangle": -90, + "textinfo": "value+percent initial+percent previous+percent total", + "xaxis": "x4", + "yaxis": "y4" + } + ], + "layout": { + "uniformtext": { + "mode": "hide", + "minsize": 10 + }, + "width": 800, + "height": 800, + "dragmode": "pan", + "xaxis": { + "domain": [ + 0, + 0.48 + ] + }, + "xaxis2": { + "anchor": "y2", + "domain": [ + 0.52, + 1 + ] + }, + "xaxis3": { + "anchor": "y3", + "domain": [ + 0, + 0.48 + ] + }, + "xaxis4": { + "anchor": "y4", + "domain": [ + 0.52, + 1 + ] + }, + "yaxis": { + "domain": [ + 0, + 0.48 + ] + }, + "yaxis2": { + "anchor": "x2", + "domain": [ + 0.52, + 1 + ] + }, + "yaxis3": { + "anchor": "x3", + "domain": [ + 0.52, + 1 + ] + }, + "yaxis4": { + "anchor": "x4", + "domain": [ + 0, + 0.48 + ] + } + } +} diff --git a/test/image/mocks/uniformtext_bar_edgecase4.json b/test/image/mocks/uniformtext_bar_edgecase4.json new file mode 100644 index 00000000000..7e40108cc48 --- /dev/null +++ b/test/image/mocks/uniformtext_bar_edgecase4.json @@ -0,0 +1,35 @@ +{ + "data": [ + { + "type": "bar", + "y": [ + 999, + 4999, + 8999, + 12999, + 16999, + 20999, + 24999, + 28999, + 32999, + 36999, + 40999, + 44999 + ], + "texttemplate": "%{y}", + "textposition": "auto", + "insidetextanchor": "start", + "textangle": 0, + "textfont": { + "size": 16 + } + } + ], + "layout": { + "width": 800, + "height": 600, + "uniformtext": { + "mode": "hide" + } + } +} diff --git a/test/image/mocks/uniformtext_bar_edgecase5.json b/test/image/mocks/uniformtext_bar_edgecase5.json new file mode 100644 index 00000000000..8922ea304f4 --- /dev/null +++ b/test/image/mocks/uniformtext_bar_edgecase5.json @@ -0,0 +1,35 @@ +{ + "data": [ + { + "type": "bar", + "y": [ + 999, + 4999, + 8999, + 12999, + 16999, + 20999, + 24999, + 28999, + 32999, + 36999, + 40999, + 44999 + ], + "texttemplate": "%{y}", + "textposition": "auto", + "insidetextanchor": "start", + "textangle": -45, + "textfont": { + "size": 16 + } + } + ], + "layout": { + "width": 800, + "height": 600, + "uniformtext": { + "mode": "hide" + } + } +} diff --git a/test/image/mocks/uniformtext_bar_edgecase6.json b/test/image/mocks/uniformtext_bar_edgecase6.json new file mode 100644 index 00000000000..a6fc6d4dc30 --- /dev/null +++ b/test/image/mocks/uniformtext_bar_edgecase6.json @@ -0,0 +1,35 @@ +{ + "data": [ + { + "type": "bar", + "y": [ + 999, + 4999, + 8999, + 12999, + 16999, + 20999, + 24999, + 28999, + 32999, + 36999, + 40999, + 44999 + ], + "texttemplate": "%{y}", + "textposition": "auto", + "insidetextanchor": "end", + "textangle": -90, + "textfont": { + "size": 16 + } + } + ], + "layout": { + "width": 800, + "height": 600, + "uniformtext": { + "mode": "hide" + } + } +} diff --git a/test/image/mocks/uniformtext_bar_edgecase7.json b/test/image/mocks/uniformtext_bar_edgecase7.json new file mode 100644 index 00000000000..4304b3854dd --- /dev/null +++ b/test/image/mocks/uniformtext_bar_edgecase7.json @@ -0,0 +1,35 @@ +{ + "data": [ + { + "type": "bar", + "x": [ + 999, + 4999, + 8999, + 12999, + 16999, + 20999, + 24999, + 28999, + 32999, + 36999, + 40999, + 44999 + ], + "texttemplate": "%{x}", + "textposition": "auto", + "insidetextanchor": "end", + "textangle": 0, + "textfont": { + "size": 16 + } + } + ], + "layout": { + "width": 300, + "height": 600, + "uniformtext": { + "mode": "hide" + } + } +} diff --git a/test/image/mocks/uniformtext_bar_edgecase8.json b/test/image/mocks/uniformtext_bar_edgecase8.json new file mode 100644 index 00000000000..7cab217f5a1 --- /dev/null +++ b/test/image/mocks/uniformtext_bar_edgecase8.json @@ -0,0 +1,41 @@ +{ + "data": [ + { + "type": "bar", + "x": [ + 999, + 4999, + 8999, + 12999, + 16999, + 20999, + 24999, + 28999, + 32999, + 36999, + 40999, + 44999 + ], + "texttemplate": "%{x}", + "textposition": "auto", + "insidetextanchor": "end", + "textangle": 15, + "textfont": { + "size": 16 + } + } + ], + "layout": { + "width": 300, + "height": 600, + "uniformtext": { + "mode": "hide" + }, + "xaxis": { + "autorange": "reversed" + }, + "yaxis": { + "autorange": "reversed" + } + } +} diff --git a/test/image/mocks/uniformtext_sunburst_inside-text-orientation.json b/test/image/mocks/uniformtext_sunburst_inside-text-orientation.json index 33bb7a4da9e..eb6a54f5cdc 100644 --- a/test/image/mocks/uniformtext_sunburst_inside-text-orientation.json +++ b/test/image/mocks/uniformtext_sunburst_inside-text-orientation.json @@ -91,7 +91,7 @@ "azure" ] }, - "textinfo": "label+value", + "textinfo": "label", "domain": { "x": [ 0.5, @@ -165,7 +165,7 @@ "Yankee", "Zulu" ], - "textinfo": "label+value", + "textinfo": "label", "domain": { "x": [ 0.5, @@ -239,7 +239,7 @@ "Yankee", "Zulu" ], - "textinfo": "label+value", + "textinfo": "label", "domain": { "x": [ 0, @@ -313,7 +313,7 @@ "Yankee", "Zulu" ], - "textinfo": "label+value", + "textinfo": "label", "domain": { "x": [ 0, diff --git a/test/image/mocks/uniformtext_sunburst_treemap.json b/test/image/mocks/uniformtext_sunburst_treemap.json index d39af521b92..7f7a0ea33a1 100644 --- a/test/image/mocks/uniformtext_sunburst_treemap.json +++ b/test/image/mocks/uniformtext_sunburst_treemap.json @@ -11,10 +11,8 @@ "marker": { "line": { "color": "#777" - }, - "colorscale": "Blackbody", - "reversescale": true, - "showscale": false + }, + "coloraxis": "coloraxis" }, "labels": [ "Alpha", @@ -84,10 +82,8 @@ "marker": { "line": { "color": "#777" - }, - "colorscale": "Blackbody", - "reversescale": true, - "showscale": false + }, + "coloraxis": "coloraxis" }, "level": "Juliet", "labels": [ @@ -150,6 +146,11 @@ } ], "layout": { + "coloraxis": { + "colorscale": "Blackbody", + "reversescale": true, + "showscale": false + }, "width": 500, "height": 1000, "margin": { diff --git a/test/image/mocks/uniformtext_treemap.json b/test/image/mocks/uniformtext_treemap.json new file mode 100644 index 00000000000..6e0a9161a94 --- /dev/null +++ b/test/image/mocks/uniformtext_treemap.json @@ -0,0 +1,351 @@ +{ + "data": [ + { + "marker": { + "coloraxis": "coloraxis" + }, + "type": "treemap", + "parents": [ + "", + "Alpha", + "Alpha", + "Charlie", + "Charlie", + "Charlie", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform" + ], + "labels": [ + "Alpha", + "Bravo", + "Charlie", + "Delta", + "Echo", + "Foxtrot", + "Golf", + "Hotel", + "India", + "Juliet", + "Kilo", + "Lima", + "Mike", + "November", + "Oscar", + "Papa", + "Quebec", + "Romeo", + "Sierra", + "Tango", + "Uniform", + "Victor", + "Whiskey", + "X ray", + "Yankee", + "Zulu" + ], + "textinfo": "label", + "domain": { + "x": [ + 0.52, + 0.98 + ], + "y": [ + 0.52, + 0.98 + ] + } + }, + { + "marker": { + "coloraxis": "coloraxis" + }, + "type": "treemap", + "level": "Uniform", + "parents": [ + "", + "Alpha", + "Alpha", + "Charlie", + "Charlie", + "Charlie", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform" + ], + "labels": [ + "Alpha", + "Bravo", + "Charlie", + "Delta", + "Echo", + "Foxtrot", + "Golf", + "Hotel", + "India", + "Juliet", + "Kilo", + "Lima", + "Mike", + "November", + "Oscar", + "Papa", + "Quebec", + "Romeo", + "Sierra", + "Tango", + "Uniform", + "Victor", + "Whiskey", + "X ray", + "Yankee", + "Zulu" + ], + "textinfo": "label", + "textfont": { + "family": "Raleway, sans-serif", + "color": "#FFF", + "size": 15 + }, + "domain": { + "x": [ + 0.52, + 0.98 + ], + "y": [ + 0.02, + 0.48 + ] + } + }, + { + "marker": { + "coloraxis": "coloraxis" + }, + "type": "treemap", + "level": "Whiskey", + "parents": [ + "", + "Alpha", + "Alpha", + "Charlie", + "Charlie", + "Charlie", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform" + ], + "labels": [ + "Alpha", + "Bravo", + "Charlie", + "Delta", + "Echo", + "Foxtrot", + "Golf", + "Hotel", + "India", + "Juliet", + "Kilo", + "Lima", + "Mike", + "November", + "Oscar", + "Papa", + "Quebec", + "Romeo", + "Sierra", + "Tango", + "Uniform", + "Victor", + "Whiskey", + "X ray", + "Yankee", + "Zulu" + ], + "textinfo": "label", + "insidetextfont": { + "family": "Courier New, monospace", + "color": "#000", + "size": 10 + }, + "pathbar": { + "textfont": { + "family": "Times New Roman, Times, serif", + "color": "#FF0", + "size": 20 + } + }, + "domain": { + "x": [ + 0.02, + 0.48 + ], + "y": [ + 0.02, + 0.48 + ] + } + }, + { + "marker": { + "coloraxis": "coloraxis" + }, + "type": "treemap", + "level": "Juliet", + "parents": [ + "", + "Alpha", + "Alpha", + "Charlie", + "Charlie", + "Charlie", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Foxtrot", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Juliet", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Oscar", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform", + "Uniform" + ], + "labels": [ + "Alpha", + "Bravo", + "Charlie", + "Delta", + "Echo", + "Foxtrot", + "Golf", + "Hotel", + "India", + "Juliet", + "Kilo", + "Lima", + "Mike", + "November", + "Oscar", + "Papa", + "Quebec", + "Romeo", + "Sierra", + "Tango", + "Uniform", + "Victor", + "Whiskey", + "X ray", + "Yankee", + "Zulu" + ], + "textinfo": "label", + "insidetextfont": { + "family": "Times New Roman, Times, serif", + "color": "#FF0", + "size": 20 + }, + "pathbar": { + "textfont": { + "family": "Courier New, monospace", + "color": "#000", + "size": 10 + } + }, + "domain": { + "x": [ + 0.02, + 0.48 + ], + "y": [ + 0.52, + 0.98 + ] + } + } + ], + "layout": { + "coloraxis": { + "colorscale": "Portland", + "reversescale": true, + "showscale": false + }, + "width": 550, + "height": 800, + "margin": { + "t": 10, + "b": 10, + "l": 10, + "r": 10 + }, + "uniformtext": { + "minsize": 12, + "mode": "hide" + } + } +} diff --git a/test/jasmine/tests/bar_test.js b/test/jasmine/tests/bar_test.js index fbf81926472..4057ef63713 100644 --- a/test/jasmine/tests/bar_test.js +++ b/test/jasmine/tests/bar_test.js @@ -2877,7 +2877,7 @@ describe('bar uniformtext', function() { }) .then(assertTextSizes('using minsize: 9', { fontsizes: [12, 12, 12, 12, 12, 12, 12], - scales: [0, 0.48, 0.48, 0.48, 0.48, 0.48, 0.48], + scales: [0, 1, 1, 1, 1, 1, 1], })) .then(function() { fig.layout.uniformtext.minsize = 32; // set a minsize greater than trace font size @@ -2893,7 +2893,7 @@ describe('bar uniformtext', function() { }) .then(assertTextSizes('using minsize: 14', { fontsizes: [14, 14, 14, 14, 14, 14, 14], - scales: [0, 0.36, 0.36, 0.36, 0.36, 0.36, 0.36], + scales: [0, 1, 1, 1, 1, 1, 1], })) .then(function() { fig.layout.uniformtext.mode = 'show'; @@ -2901,7 +2901,15 @@ describe('bar uniformtext', function() { }) .then(assertTextSizes('using mode: "show"', { fontsizes: [14, 14, 14, 14, 14, 14, 14], - scales: [0.36, 0.36, 0.36, 0.36, 0.36, 0.36, 0.36], + scales: [1, 1, 1, 1, 1, 1, 1], + })) + .then(function() { + fig.layout.uniformtext = undefined; // back to default + return Plotly.react(gd, fig); + }) + .then(assertTextSizes('clear uniformtext', { + fontsizes: [12, 12, 12, 12, 12, 12, 12], + scales: [0.48, 1, 1, 1, 1, 1, 1], })) .catch(failTest) .then(done); diff --git a/test/jasmine/tests/funnel_test.js b/test/jasmine/tests/funnel_test.js index bc5603ab6bb..3a49a70e2c5 100644 --- a/test/jasmine/tests/funnel_test.js +++ b/test/jasmine/tests/funnel_test.js @@ -1699,7 +1699,7 @@ describe('funnel uniformtext', function() { }) .then(assertTextSizes('using minsize: 9', { fontsizes: [12, 12, 12, 12, 12, 12, 12], - scales: [0, 0.44, 0.44, 0.44, 0.44, 0.44, 0.44], + scales: [0, 1, 1, 1, 1, 1, 1], })) .then(function() { fig.layout.uniformtext.minsize = 32; // set a minsize greater than trace font size @@ -1715,7 +1715,7 @@ describe('funnel uniformtext', function() { }) .then(assertTextSizes('using minsize: 14', { fontsizes: [14, 14, 14, 14, 14, 14, 14], - scales: [0, 0.33, 0.33, 0.33, 0.33, 0.33, 0.33], + scales: [0, 1, 1, 1, 1, 1, 1], })) .then(function() { fig.layout.uniformtext.mode = 'show'; @@ -1723,7 +1723,15 @@ describe('funnel uniformtext', function() { }) .then(assertTextSizes('using mode: "show"', { fontsizes: [14, 14, 14, 14, 14, 14, 14], - scales: [0.33, 0.33, 0.33, 0.33, 0.33, 0.33, 0.33], + scales: [1, 1, 1, 1, 1, 1, 1], + })) + .then(function() { + fig.layout.uniformtext = undefined; // back to default + return Plotly.react(gd, fig); + }) + .then(assertTextSizes('clear uniformtext', { + fontsizes: [12, 12, 12, 12, 12, 12, 12], + scales: [0.44, 1, 1, 1, 1, 1, 1], })) .catch(failTest) .then(done); diff --git a/test/jasmine/tests/funnelarea_test.js b/test/jasmine/tests/funnelarea_test.js index ac6ef54bd10..4ee0eda06e6 100644 --- a/test/jasmine/tests/funnelarea_test.js +++ b/test/jasmine/tests/funnelarea_test.js @@ -1802,7 +1802,7 @@ describe('funnelarea uniformtext', function() { }) .then(assertTextSizes('using minsize: 9', { fontsizes: [12, 12, 12, 12, 12, 12, 12, 12], - scales: [0.69, 0.69, 0.69, 0.69, 0.69, 0.69, 0.69, 0], + scales: [1, 1, 1, 1, 1, 1, 1, 0], })) .then(function() { fig.layout.uniformtext.minsize = 32; // set a minsize greater than trace font size @@ -1810,15 +1810,15 @@ describe('funnelarea uniformtext', function() { }) .then(assertTextSizes('using minsize: 32', { fontsizes: [32, 32, 32, 32, 32, 32, 32, 32], - scales: [0, 0.26, 0, 0, 0, 0, 0, 0], + scales: [0, 1, 0, 0, 0, 0, 0, 0], })) .then(function() { fig.layout.uniformtext.minsize = 13; // set a minsize greater than trace font size return Plotly.react(gd, fig); }) - .then(assertTextSizes('using minsize: 13', { + .then(assertTextSizes('using minsize: 16', { fontsizes: [13, 13, 13, 13, 13, 13, 13, 13], - scales: [0.64, 0.64, 0.64, 0.64, 0.64, 0.64, 0.64, 0], + scales: [1, 1, 1, 1, 1, 1, 1, 0], })) .then(function() { fig.layout.uniformtext.mode = 'show'; @@ -1826,7 +1826,15 @@ describe('funnelarea uniformtext', function() { }) .then(assertTextSizes('using mode: "show"', { fontsizes: [13, 13, 13, 13, 13, 13, 13, 13], - scales: [0.64, 0.64, 0.64, 0.64, 0.64, 0.64, 0.64, 0.64], + scales: [1, 1, 1, 1, 1, 1, 1, 1], + })) + .then(function() { + fig.layout.uniformtext = undefined; // back to default + return Plotly.react(gd, fig); + }) + .then(assertTextSizes('clear uniformtext', { + fontsizes: [12, 12, 12, 12, 12, 12, 12, 12], + scales: [1, 1, 1, 1, 1, 1, 1, 0.69], })) .catch(failTest) .then(done); diff --git a/test/jasmine/tests/pie_test.js b/test/jasmine/tests/pie_test.js index 668f1e42832..f4962575b51 100644 --- a/test/jasmine/tests/pie_test.js +++ b/test/jasmine/tests/pie_test.js @@ -1983,7 +1983,7 @@ describe('pie uniformtext', function() { }) .then(assertTextSizes('using minsize: 9', { fontsizes: [12, 12, 12, 12, 12, 12, 12, 12], - scales: [0.58, 0.58, 0.58, 0.58, 0.58, 0.58, 0.58, 0], + scales: [1, 1, 1, 1, 1, 1, 1, 0], })) .then(function() { fig.layout.uniformtext.minsize = 32; // set a minsize greater than trace font size @@ -1991,7 +1991,7 @@ describe('pie uniformtext', function() { }) .then(assertTextSizes('using minsize: 32', { fontsizes: [32, 32, 32, 32, 32, 32, 32, 32], - scales: [0, 0.22, 0.22, 0.22, 0, 0, 0, 0], + scales: [0, 1, 1, 1, 0, 0, 0, 0], })) .then(function() { fig.layout.uniformtext.minsize = 16; // set a minsize greater than trace font size @@ -1999,7 +1999,7 @@ describe('pie uniformtext', function() { }) .then(assertTextSizes('using minsize: 16', { fontsizes: [16, 16, 16, 16, 16, 16, 16, 16], - scales: [0.44, 0.44, 0.44, 0.44, 0.44, 0.44, 0.44, 0], + scales: [1, 1, 1, 1, 1, 1, 1, 0], })) .then(function() { fig.layout.uniformtext.mode = 'show'; @@ -2007,7 +2007,15 @@ describe('pie uniformtext', function() { }) .then(assertTextSizes('using mode: "show"', { fontsizes: [16, 16, 16, 16, 16, 16, 16, 16], - scales: [0.44, 0.44, 0.44, 0.44, 0.44, 0.44, 0.44, 0.44], + scales: [1, 1, 1, 1, 1, 1, 1, 1], + })) + .then(function() { + fig.layout.uniformtext = undefined; // back to default + return Plotly.react(gd, fig); + }) + .then(assertTextSizes('clear uniformtext', { + fontsizes: [12, 12, 12, 12, 12, 12, 12, 12], + scales: [1, 1, 1, 1, 1, 1, 1, 0.58], })) .catch(failTest) .then(done); diff --git a/test/jasmine/tests/sunburst_test.js b/test/jasmine/tests/sunburst_test.js index 3d2727dceeb..9c35d5e51de 100644 --- a/test/jasmine/tests/sunburst_test.js +++ b/test/jasmine/tests/sunburst_test.js @@ -2076,7 +2076,7 @@ describe('sunburst uniformtext', function() { }) .then(assertTextSizes('using minsize: 9', { fontsizes: [12, 12, 12, 12, 12, 12, 12, 12, 12, 12], - scales: [0.58, 0.58, 0.58, 0.58, 0.58, 0.58, 0.58, 0.58, 0.58, 0], + scales: [1, 1, 1, 1, 1, 1, 1, 1, 1, 0], })) .then(function() { fig.layout.uniformtext.minsize = 32; // set a minsize greater than trace font size @@ -2084,7 +2084,7 @@ describe('sunburst uniformtext', function() { }) .then(assertTextSizes('using minsize: 32', { fontsizes: [32, 32, 32, 32, 32, 32, 32, 32, 32, 32], - scales: [0, 0.22, 0.22, 0.22, 0.22, 0.22, 0, 0, 0, 0], + scales: [0, 1, 1, 1, 1, 1, 0, 0, 0, 0], })) .then(function() { fig.layout.uniformtext.minsize = 16; // set a minsize greater than trace font size @@ -2092,7 +2092,7 @@ describe('sunburst uniformtext', function() { }) .then(assertTextSizes('using minsize: 16', { fontsizes: [16, 16, 16, 16, 16, 16, 16, 16, 16, 16], - scales: [0.44, 0.44, 0.44, 0.44, 0.44, 0.44, 0.44, 0.44, 0.44, 0], + scales: [1, 1, 1, 1, 1, 1, 1, 1, 1, 0], })) .then(function() { fig.layout.uniformtext.mode = 'show'; @@ -2100,7 +2100,79 @@ describe('sunburst uniformtext', function() { }) .then(assertTextSizes('using mode: "show"', { fontsizes: [16, 16, 16, 16, 16, 16, 16, 16, 16, 16], - scales: [0.44, 0.44, 0.44, 0.44, 0.44, 0.44, 0.44, 0.44, 0.44, 0.44], + scales: [1, 1, 1, 1, 1, 1, 1, 1, 1, 1], + })) + .then(function() { + fig.layout.uniformtext = undefined; // back to default + return Plotly.react(gd, fig); + }) + .then(assertTextSizes('clear uniformtext', { + fontsizes: [12, 12, 12, 12, 12, 12, 12, 12, 12, 12], + scales: [1, 1, 1, 1, 1, 1, 1, 1, 1, 0.58], + })) + .catch(failTest) + .then(done); + }); + + it('should uniform text scales after transition', function(done) { + Plotly.plot(gd, { + data: [{ + type: 'sunburst', + parents: [ + '', + 'Oscar', + 'Oscar', + 'Oscar', + 'Oscar', + 'Oscar', + 'Oscar', + 'Uniform', + 'Uniform', + 'Uniform', + 'Uniform', + 'Uniform', + 'Uniform' + ], + labels: [ + 'Oscar', + 'Papa', + 'Quebec', + 'Romeo and Juliet', + 'Sierra', + 'Tango', + 'Uniform', + 'ViKtor Korchnoi - Anatoly Karpov', + 'Whiskey', + 'X ray', + 'Yankee', + 'Zulu' + ], + textinfo: 'label' + }], + layout: { + width: 500, + height: 500, + uniformtext: { + mode: 'hide', + minsize: 12 + } + } + }) + .then(assertTextSizes('before click', { + fontsizes: [12, 12, 12, 12, 12, 12, 12, 12, 12, 12, 12, 12], + scales: [1, 1, 1, 1, 0, 1, 1, 0, 1, 1, 1, 1], + })) + .then(click(gd, 2)) // click on Uniform + .then(delay(constants.CLICK_TRANSITION_TIME + 1)) + .then(assertTextSizes('after click child', { + fontsizes: [12, 12, 12, 12, 12, 12], + scales: [1, 0, 1, 1, 1, 1], + })) + .then(click(gd, 1)) // click on Oscar + .then(delay(constants.CLICK_TRANSITION_TIME + 1)) + .then(assertTextSizes('after click parent', { + fontsizes: [12, 12, 12, 12, 12, 12, 12, 12, 12, 12, 12, 12], + scales: [1, 1, 1, 1, 0, 1, 1, 0, 1, 1, 1, 1], })) .catch(failTest) .then(done); diff --git a/test/jasmine/tests/treemap_test.js b/test/jasmine/tests/treemap_test.js index 4e4357333dc..f8d87bbcfa2 100644 --- a/test/jasmine/tests/treemap_test.js +++ b/test/jasmine/tests/treemap_test.js @@ -251,7 +251,7 @@ describe('Test treemap defaults:', function() { ]); expect(fullData[0].pathbar.textfont.family).toBe('"Open Sans", verdana, arial, sans-serif'); - expect(fullData[0].pathbar.textfont.color).toBe('#444'); + expect(fullData[0].pathbar.textfont.color).toBe(undefined); expect(fullData[0].pathbar.textfont.size).toBe(12); expect(fullData[0].pathbar.thickness).toBe(18); expect(fullData[0].pathbar.side).toBe('top'); @@ -266,7 +266,7 @@ describe('Test treemap defaults:', function() { }); expect(fullData[0].pathbar.textfont.family).toBe('Times New Romans'); - expect(fullData[0].pathbar.textfont.color).toBe('#ABC'); + expect(fullData[0].pathbar.textfont.color).toBe(undefined); expect(fullData[0].pathbar.textfont.size).toBe(24); expect(fullData[0].pathbar.thickness).toBe(30); }); @@ -1811,6 +1811,80 @@ describe('treemap uniformtext', function() { fontsizes: [13, 13, 13, 13, 13, 13, 13, 13, 13, 13, 13], scales: [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1], })) + .then(function() { + fig.layout.uniformtext = undefined; // back to default + return Plotly.react(gd, fig); + }) + .then(assertTextSizes('clear uniformtext', { + fontsizes: [12, 12, 12, 12, 12, 12, 12, 12, 12, 12, 12], + scales: [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0.84], + })) + .catch(failTest) + .then(done); + }); + + it('should uniform text scales after transition', function(done) { + Plotly.plot(gd, { + data: [{ + type: 'treemap', + tiling: { packing: 'dice'}, + pathbar: { visible: false }, + parents: [ + '', + 'Oscar', + 'Oscar', + 'Oscar', + 'Oscar', + 'Oscar', + 'Oscar', + 'Uniform', + 'Uniform', + 'Uniform', + 'Uniform', + 'Uniform', + 'Uniform' + ], + labels: [ + 'Oscar', + 'Papa', + 'Quebec', + 'Romeo and Juliet', + 'Sierra', + 'Tango', + 'Uniform', + 'ViKtor Korchnoi - Anatoly Karpov', + 'Whiskey', + 'X ray', + 'Yankee', + 'Zulu' + ], + textinfo: 'label' + }], + layout: { + width: 850, + height: 350, + uniformtext: { + mode: 'hide', + minsize: 12 + } + } + }) + .then(assertTextSizes('before click', { + fontsizes: [12, 12, 12, 12, 12, 12, 12, 12, 12, 12, 12, 12], + scales: [1, 1, 1, 1, 0, 1, 1, 0, 1, 1, 1, 1], + })) + .then(click(gd, 2)) // click on Uniform + .then(delay(constants.CLICK_TRANSITION_TIME + 1)) + .then(assertTextSizes('after click child', { + fontsizes: [12, 12, 12, 12, 12, 12], + scales: [1, 0, 1, 1, 1, 1], + })) + .then(click(gd, 1)) // click on Oscar + .then(delay(constants.CLICK_TRANSITION_TIME + 1)) + .then(assertTextSizes('after click parent', { + fontsizes: [12, 12, 12, 12, 12, 12, 12, 12, 12, 12, 12, 12], + scales: [1, 1, 1, 1, 0, 1, 1, 0, 1, 1, 1, 1], + })) .catch(failTest) .then(done); }); diff --git a/test/jasmine/tests/waterfall_test.js b/test/jasmine/tests/waterfall_test.js index eaeafc9c436..39d4cdd466d 100644 --- a/test/jasmine/tests/waterfall_test.js +++ b/test/jasmine/tests/waterfall_test.js @@ -1822,7 +1822,7 @@ describe('waterfall uniformtext', function() { }) .then(assertTextSizes('using minsize: 9', { fontsizes: [12, 12, 12, 12, 12, 12, 12], - scales: [0, 0.48, 0.48, 0.48, 0.48, 0.48, 0.48], + scales: [0, 1, 1, 1, 1, 1, 1], })) .then(function() { fig.layout.uniformtext.minsize = 32; // set a minsize greater than trace font size @@ -1838,7 +1838,7 @@ describe('waterfall uniformtext', function() { }) .then(assertTextSizes('using minsize: 14', { fontsizes: [14, 14, 14, 14, 14, 14, 14], - scales: [0, 0.36, 0.36, 0.36, 0.36, 0.36, 0.36], + scales: [0, 1, 1, 1, 1, 1, 1], })) .then(function() { fig.layout.uniformtext.mode = 'show'; @@ -1846,7 +1846,15 @@ describe('waterfall uniformtext', function() { }) .then(assertTextSizes('using mode: "show"', { fontsizes: [14, 14, 14, 14, 14, 14, 14], - scales: [0.36, 0.36, 0.36, 0.36, 0.36, 0.36, 0.36], + scales: [1, 1, 1, 1, 1, 1, 1], + })) + .then(function() { + fig.layout.uniformtext = undefined; // back to default + return Plotly.react(gd, fig); + }) + .then(assertTextSizes('clear uniformtext', { + fontsizes: [12, 12, 12, 12, 12, 12, 12], + scales: [0.48, 1, 1, 1, 1, 1, 1], })) .catch(failTest) .then(done);