From 318f207eb51ffc2fc5df3baf84c04162d28ccd5e Mon Sep 17 00:00:00 2001 From: sushuang Date: Wed, 30 Aug 2017 00:03:21 +0800 Subject: [PATCH] Fix #6529 Fix #6516 Fix #6532 (fix flatterning textStyle, and emphasis without 'show' set in normal) --- src/chart/bar/helper.js | 40 +++----- src/chart/custom.js | 11 ++- src/chart/funnel/FunnelView.js | 29 +++--- src/chart/heatmap/HeatmapView.js | 19 ++-- src/chart/helper/Line.js | 25 +++-- src/chart/helper/Symbol.js | 28 ++---- src/chart/map/MapView.js | 28 +++--- src/chart/pie/PieView.js | 31 ++++--- src/chart/radar/RadarView.js | 30 +++--- src/chart/sankey/SankeyView.js | 29 +++--- src/chart/treemap/TreemapView.js | 40 ++++---- src/component/helper/MapDraw.js | 36 ++++---- src/component/marker/MarkAreaView.js | 25 ++--- src/coord/geo/GeoModel.js | 11 +-- src/util/graphic.js | 131 +++++++++++++++++++++------ 15 files changed, 279 insertions(+), 234 deletions(-) diff --git a/src/chart/bar/helper.js b/src/chart/bar/helper.js index 20a0aee592..c793ff3fbe 100644 --- a/src/chart/bar/helper.js +++ b/src/chart/bar/helper.js @@ -1,6 +1,5 @@ define(function (require) { - var zrUtil = require('zrender/core/util'); var graphic = require('../../util/graphic'); var helper = {}; @@ -11,35 +10,22 @@ define(function (require) { var labelModel = itemModel.getModel('label.normal'); var hoverLabelModel = itemModel.getModel('label.emphasis'); - if (labelModel.get('show')) { - setLabel( - normalStyle, labelModel, color, - zrUtil.retrieve2( - seriesModel.getFormattedLabel(dataIndex, 'normal'), - seriesModel.getRawValue(dataIndex) - ), - labelPositionOutside - ); - } - else { - normalStyle.text = null; - } + graphic.setLabelStyle( + normalStyle, hoverStyle, labelModel, hoverLabelModel, + { + labelFetcher: seriesModel, + labelDataIndex: dataIndex, + defaultText: seriesModel.getRawValue(dataIndex), + isRectText: true, + autoColor: color + } + ); - if (hoverLabelModel.get('show')) { - setLabel( - hoverStyle, hoverLabelModel, false, - seriesModel.getFormattedLabel(dataIndex, 'emphasis'), - labelPositionOutside - ); - } - else { - hoverStyle.text = null; - } + fixPosition(normalStyle); + fixPosition(hoverStyle); }; - function setLabel(style, model, defaultColor, labelText, labelPositionOutside) { - graphic.setText(style, model, defaultColor); - style.text = labelText; + function fixPosition(style, labelPositionOutside) { if (style.textPosition === 'outside') { style.textPosition = labelPositionOutside; } diff --git a/src/chart/custom.js b/src/chart/custom.js index f50aafe5c9..8889462c70 100644 --- a/src/chart/custom.js +++ b/src/chart/custom.js @@ -341,7 +341,11 @@ define(function (require) { opacity != null && (itemStyle.opacity = opacity); if (currLabelValueDim != null) { - graphicUtil.setText(itemStyle, currLabelNormalModel, currVisualColor); + graphicUtil.setTextStyle(itemStyle, currLabelNormalModel, null, { + autoColor: currVisualColor, + isRectText: true + }); + itemStyle.text = currLabelNormalModel.getShallow('show') ? zrUtil.retrieve2( customSeries.getFormattedLabel(dataIndexInside, 'normal'), @@ -366,7 +370,10 @@ define(function (require) { var itemStyle = currItemModel.getModel(ITEM_STYLE_EMPHASIS_PATH).getItemStyle(); if (currLabelValueDim != null) { - graphicUtil.setText(itemStyle, currLabelEmphasisModel, false); + graphicUtil.setTextStyle(itemStyle, currLabelEmphasisModel, null, { + isRectText: true + }, true); + itemStyle.text = currLabelEmphasisModel.getShallow('show') ? zrUtil.retrieve3( customSeries.getFormattedLabel(dataIndexInside, 'emphasis'), diff --git a/src/chart/funnel/FunnelView.js b/src/chart/funnel/FunnelView.js index af799c09de..e3977c1ae4 100644 --- a/src/chart/funnel/FunnelView.js +++ b/src/chart/funnel/FunnelView.js @@ -129,17 +129,22 @@ define(function (require) { var labelLineHoverModel = itemModel.getModel('labelLine.emphasis'); var visualColor = data.getItemVisual(idx, 'color'); - graphic.setTextStyle(labelText.style, labelModel, { - textAlign: labelLayout.textAlign, - textVerticalAlign: labelLayout.verticalAlign, - text: zrUtil.retrieve(data.hostModel.getFormattedLabel(idx, 'normal'), data.getName(idx)) - }, { - defaultTextColor: visualColor, - autoColor: visualColor, - checkInside: function (model, opt) { - return labelLayout.inside; + graphic.setLabelStyle( + labelText.style, labelText.hoverStyle = {}, labelModel, labelHoverModel, + { + labelFetcher: data.hostModel, + labelDataIndex: idx, + defaultText: data.getName(idx), + autoColor: visualColor, + checkInside: function (model, opt) { + return labelLayout.inside; + } + }, + { + textAlign: labelLayout.textAlign, + textVerticalAlign: labelLayout.verticalAlign } - }); + ); labelText.ignore = labelText.normalIgnore = !labelModel.get('show'); labelText.hoverIgnore = !labelHoverModel.get('show'); @@ -153,10 +158,6 @@ define(function (require) { }); labelLine.setStyle(labelLineModel.getModel('lineStyle').getLineStyle()); - labelText.hoverStyle = graphic.setTextStyle({}, labelHoverModel, { - text: data.hostModel.getFormattedLabel(idx, 'emphasis') - }, {forMerge: true}); - labelLine.hoverStyle = labelLineHoverModel.getModel('lineStyle').getLineStyle(); }; diff --git a/src/chart/heatmap/HeatmapView.js b/src/chart/heatmap/HeatmapView.js index 70beeaca60..88b209cc1c 100644 --- a/src/chart/heatmap/HeatmapView.js +++ b/src/chart/heatmap/HeatmapView.js @@ -192,18 +192,17 @@ define(function (require) { defaultText = rawValue[2]; } - graphic.setText(style, labelModel); - style.text = labelModel.getShallow('show') - ? seriesModel.getFormattedLabel(idx, 'normal') || defaultText - : null; - - graphic.setText(hoverStl, hoverLabelModel, false); - hoverStl.text = hoverLabelModel.getShallow('show') - ? seriesModel.getFormattedLabel(idx, 'emphasis') - : null; + graphic.setLabelStyle( + style, hoverStl, labelModel, hoverLabelModel, + { + labelFetcher: seriesModel, + labelDataIndex: idx, + defaultText: defaultText, + isRectText: true + } + ); rect.setStyle(style); - graphic.setHoverStyle(rect, data.hasItemOption ? hoverStl : zrUtil.extend({}, hoverStl)); group.add(rect); diff --git a/src/chart/helper/Line.js b/src/chart/helper/Line.js index c7ff402790..8100f56f16 100644 --- a/src/chart/helper/Line.js +++ b/src/chart/helper/Line.js @@ -298,6 +298,8 @@ define(function (require) { var label = this.childOfName('label'); var defaultLabelColor; var defaultText; + var normalText; + var emphasisText; if (showLabel || hoverShowLabel) { var rawVal = seriesModel.getRawValue(idx); @@ -307,17 +309,22 @@ define(function (require) { ? numberUtil.round(rawVal) : rawVal; defaultLabelColor = visualColor || '#000'; + + normalText = zrUtil.retrieve2( + seriesModel.getFormattedLabel(idx, 'normal', lineData.dataType), + defaultText + ); + emphasisText = zrUtil.retrieve2( + seriesModel.getFormattedLabel(idx, 'emphasis', lineData.dataType), + normalText + ); } // label.afterUpdate = lineAfterUpdate; - if (showLabel) { + if (showLabel || hoverShowLabel) { var labelStyle = graphic.setTextStyle(label.style, labelModel, { - text: zrUtil.retrieve2( - seriesModel.getFormattedLabel(idx, 'normal', lineData.dataType), - defaultText - ) + text: normalText }, { - defaultTextColor: defaultLabelColor, autoColor: defaultLabelColor }); @@ -329,13 +336,11 @@ define(function (require) { else { label.setStyle('text', null); } + if (hoverShowLabel) { // Only these properties supported in this emphasis style here. label.hoverStyle = { - text: zrUtil.retrieve2( - seriesModel.getFormattedLabel(idx, 'emphasis', lineData.dataType), - defaultText - ), + text: emphasisText, textFill: hoverLabelModel.getTextColor(true), // For merging hover style to normal style, do not use // `hoverLabelModel.getFont()` here. diff --git a/src/chart/helper/Symbol.js b/src/chart/helper/Symbol.js index 9ed1c64053..7b448f7827 100644 --- a/src/chart/helper/Symbol.js +++ b/src/chart/helper/Symbol.js @@ -226,24 +226,16 @@ define(function (require) { var valueDim = labelHelper.findLabelValueDim(data); if (valueDim != null) { - graphic.setText(elStyle, labelModel, color); - var normalText = seriesModel.getFormattedLabel(idx, 'normal'); - var value = data.get(valueDim, idx); - elStyle.text = labelModel.getShallow('show') - ? zrUtil.retrieve2( - normalText, - value - ) - : null; - - graphic.setText(hoverItemStyle, hoverLabelModel, false); - hoverItemStyle.text = hoverLabelModel.getShallow('show') - ? zrUtil.retrieve3( - seriesModel.getFormattedLabel(idx, 'emphasis'), - normalText, - value - ) - : null; + graphic.setLabelStyle( + elStyle, hoverItemStyle, labelModel, hoverLabelModel, + { + labelFetcher: seriesModel, + labelDataIndex: idx, + defaultText: data.get(valueDim, idx), + isRectText: true, + autoColor: color + } + ); } symbolPath.off('mouseover') diff --git a/src/chart/map/MapView.js b/src/chart/map/MapView.js index 7a0151a848..5bffd9c5dd 100644 --- a/src/chart/map/MapView.js +++ b/src/chart/map/MapView.js @@ -116,16 +116,19 @@ define(function (require) { var polygonGroups = fullData.getItemGraphicEl(fullIndex); + var normalText = zrUtil.retrieve2( + mapModel.getFormattedLabel(idx, 'normal'), + name + ); + var emphasisText = zrUtil.retrieve2( + mapModel.getFormattedLabel(idx, 'emphasis'), + normalText + ); + var onEmphasis = function () { var hoverStyle = graphic.setTextStyle({}, hoverLabelModel, { - text: hoverLabelModel.get('show') - ? zrUtil.retrieve3( - mapModel.getFormattedLabel(idx, 'emphasis'), - mapModel.getFormattedLabel(idx, 'normal'), - name - ) - : null - }, {isRectText: true, forMerge: true}); + text: hoverLabelModel.get('show') ? emphasisText : null + }, {isRectText: true, checkInside: false}, true); circle.style.extendFrom(hoverStyle); // Make label upper than others if overlaps. circle.__mapOriginalZ2 = circle.z2; @@ -134,14 +137,9 @@ define(function (require) { var onNormal = function () { graphic.setTextStyle(circle.style, labelModel, { - text: labelModel.get('show') - ? zrUtil.retrieve2( - mapModel.getFormattedLabel(idx, 'normal'), - name - ) - : null, + text: labelModel.get('show') ? normalText : null, textPosition: labelModel.getShallow('position') || 'bottom' - }, {isRectText: true}); + }, {isRectText: true, checkInside: false}); if (circle.__mapOriginalZ2 != null) { circle.z2 = circle.__mapOriginalZ2; diff --git a/src/chart/pie/PieView.js b/src/chart/pie/PieView.js index 3cc699474e..1b8f7d8845 100644 --- a/src/chart/pie/PieView.js +++ b/src/chart/pie/PieView.js @@ -231,18 +231,23 @@ define(function (require) { var labelLineHoverModel = itemModel.getModel('labelLine.emphasis'); var visualColor = data.getItemVisual(idx, 'color'); - graphic.setTextStyle(labelText.style, labelModel, { - textVerticalAlign: labelLayout.verticalAlign, - textAlign: labelLayout.textAlign, - opacity: data.getItemVisual(idx, 'opacity'), - text: zrUtil.retrieve(data.hostModel.getFormattedLabel(idx, 'normal'), data.getName(idx)) - }, { - defaultTextColor: visualColor, - autoColor: visualColor, - checkInside: function (model, opt) { - return labelLayout.inside; + graphic.setLabelStyle( + labelText.style, labelText.hoverStyle = {}, labelModel, labelHoverModel, + { + labelFetcher: data.hostModel, + labelDataIndex: idx, + defaultText: data.getName(idx), + autoColor: visualColor, + checkInside: function (model, opt) { + return labelLayout.inside; + } + }, + { + textAlign: labelLayout.textAlign, + textVerticalAlign: labelLayout.verticalAlign, + opacity: data.getItemVisual(idx, 'opacity') } - }); + ); labelText.ignore = labelText.normalIgnore = !labelModel.get('show'); labelText.hoverIgnore = !labelHoverModel.get('show'); @@ -257,10 +262,6 @@ define(function (require) { }); labelLine.setStyle(labelLineModel.getModel('lineStyle').getLineStyle()); - labelText.hoverStyle = graphic.setTextStyle({}, labelHoverModel, { - text: data.hostModel.getFormattedLabel(idx, 'emphasis') - }, {forMerge: true}); - labelLine.hoverStyle = labelLineHoverModel.getModel('lineStyle').getLineStyle(); var smooth = labelLineModel.get('smooth'); diff --git a/src/chart/radar/RadarView.js b/src/chart/radar/RadarView.js index 5ff37b0278..b139a3b35b 100644 --- a/src/chart/radar/RadarView.js +++ b/src/chart/radar/RadarView.js @@ -174,25 +174,17 @@ define(function (require) { symbolPath.setStyle(itemStyle); symbolPath.hoverStyle = zrUtil.clone(itemHoverStyle); - var defaultText = data.get(data.dimensions[symbolPath.__dimIdx], idx); - graphic.setText(symbolPath.style, labelModel, color); - symbolPath.setStyle({ - text: labelModel.get('show') - ? zrUtil.retrieve( - seriesModel.getFormattedLabel( - idx, 'normal', null, symbolPath.__dimIdx - ), - defaultText - ) - : null - }); - - graphic.setText(symbolPath.hoverStyle, labelHoverModel, true); - symbolPath.hoverStyle.text = labelHoverModel.get('show') - ? seriesModel.getFormattedLabel( - idx, 'emphasis', null, symbolPath.__dimIdx - ) - : null; + graphic.setLabelStyle( + symbolPath.style, symbolPath.hoverStyle, labelModel, labelHoverModel, + { + labelFetcher: data.hostModel, + labelDataIndex: idx, + labelDimIndex: symbolPath.__dimIdx, + defaultText: data.get(data.dimensions[symbolPath.__dimIdx], idx), + autoColor: color, + isRectText: true + } + ); }); function onEmphasis() { diff --git a/src/chart/sankey/SankeyView.js b/src/chart/sankey/SankeyView.js index 00295a021e..9713764b37 100644 --- a/src/chart/sankey/SankeyView.js +++ b/src/chart/sankey/SankeyView.js @@ -5,7 +5,6 @@ define(function (require) { var graphic = require('../../util/graphic'); - var zrUtil = require('zrender/core/util'); var SankeyShape = graphic.extendShape({ shape: { @@ -129,25 +128,21 @@ define(function (require) { style: itemModel.getModel('itemStyle.normal').getItemStyle() }); - graphic.setTextStyle(rect.style, labelModel, { - // Get formatted label in label.normal option - // Use node id if it is not specified - text: labelModel.get('show') - ? seriesModel.getFormattedLabel(node.dataIndex, 'normal') || node.id - // Use empty string to hide the label - : null - }, {isRectText: true}); + var hoverStyle = node.getModel('itemStyle.emphasis').getItemStyle(); + + graphic.setLabelStyle( + rect.style, hoverStyle, labelModel, labelHoverModel, + { + labelFetcher: seriesModel, + labelDataIndex: node.dataIndex, + defaultText: node.id, + isRectText: true + } + ); rect.setStyle('fill', node.getVisual('color')); - var hoverStyle = node.getModel('itemStyle.emphasis').getItemStyle(); - graphic.setHoverStyle(rect, zrUtil.extend( - graphic.setTextStyle(hoverStyle, labelHoverModel, { - text: labelHoverModel.get('show') - ? seriesModel.getFormattedLabel(node.dataIndex, 'emphasis') - : null - }, {isRectText: true, forMerge: true}) - )); + graphic.setHoverStyle(rect, hoverStyle); group.add(rect); diff --git a/src/chart/treemap/TreemapView.js b/src/chart/treemap/TreemapView.js index aec440ebb9..f624ce9b21 100644 --- a/src/chart/treemap/TreemapView.js +++ b/src/chart/treemap/TreemapView.js @@ -815,28 +815,30 @@ var normalLabelModel = nodeModel.getModel( upperLabelRect ? PATH_UPPERLABEL_NORMAL : PATH_LABEL_NOAMAL ); - graphic.setText(normalStyle, normalLabelModel, visualColor); - - upperLabelRect && (normalStyle.textRect = zrUtil.clone(upperLabelRect)); - - if (!normalLabelModel.getShallow('show')) { - normalStyle.text = normalStyle.truncate = null; - } - else { - normalStyle.text = text; - normalStyle.truncate = normalLabelModel.get('ellipsis') - ? { - outerWidth: width, - outerHeight: height, - minChar: 2 - } - : null; - } - var emphasisLabelModel = nodeModel.getModel( upperLabelRect ? PATH_UPPERLABEL_EMPHASIS : PATH_LABEL_EMPHASIS ); - graphic.setText(emphasisStyle, emphasisLabelModel, false); + + var isShow = normalLabelModel.getShallow('show'); + + graphic.setLabelStyle( + normalStyle, emphasisStyle, normalLabelModel, emphasisLabelModel, + { + defaultText: isShow ? text : null, + autoColor: visualColor, + isRectText: true + } + ); + + upperLabelRect && (normalStyle.textRect = zrUtil.clone(upperLabelRect)); + + normalStyle.truncate = (isShow && normalLabelModel.get('ellipsis')) + ? { + outerWidth: width, + outerHeight: height, + minChar: 2 + } + : null; } function giveGraphic(storageName, Ctor, depth, z) { diff --git a/src/component/helper/MapDraw.js b/src/component/helper/MapDraw.js index 8d12a3ca50..3a2c9da13c 100644 --- a/src/component/helper/MapDraw.js +++ b/src/component/helper/MapDraw.js @@ -123,8 +123,8 @@ define(function (require) { var isGeo = mapOrGeoModel.mainType === 'geo'; - // map series has data, geo model that controlled by map series - // has no data, otherwise data exists. + // Map series has data. GEO model that controlled by map series + // will be assigned with map data. Other GEO model has no data. var data = mapOrGeoModel.getData && mapOrGeoModel.getData(); isGeo && ecModel.eachComponent({mainType: 'series', subType: 'map'}, function (mapSeries) { if (!data && mapSeries.getHostGeoModel() === mapOrGeoModel) { @@ -235,14 +235,14 @@ define(function (require) { (isGeo || isDataNaN && (showLabel || hoverShowLabel)) || (itemLayout && itemLayout.showLabel) ) { - var query = data ? dataIdx : region.name; - var formattedStr; - var hoverFormattedStr; + var query = !isGeo ? dataIdx : region.name; + var labelFetcher; + // Consider dataIdx not found. if (!data || dataIdx >= 0) { - formattedStr = mapOrGeoModel.getFormattedLabel(query, 'normal'); - hoverFormattedStr = mapOrGeoModel.getFormattedLabel(query, 'emphasis'); + labelFetcher = mapOrGeoModel; } + var textEl = new graphic.Text({ position: region.center.slice(), scale: [1 / scale[0], 1 / scale[1]], @@ -250,15 +250,19 @@ define(function (require) { silent: true }); - graphic.setTextStyle(textEl.style, labelModel, { - text: showLabel ? (formattedStr || region.name) : null, - textAlign: 'center', - textVerticalAlign: 'middle' - }); - - graphic.setTextStyle(textEl.hoverStyle = {}, hoverLabelModel, { - text: hoverShowLabel ? (hoverFormattedStr || formattedStr || region.name) : null - }, {forMerge: true}); + graphic.setLabelStyle( + textEl.style, textEl.hoverStyle = {}, labelModel, hoverLabelModel, + { + labelFetcher: labelFetcher, + labelDataIndex: query, + defaultText: region.name, + checkInside: false + }, + { + textAlign: 'center', + textVerticalAlign: 'middle' + } + ); regionGroup.add(textEl); } diff --git a/src/component/marker/MarkAreaView.js b/src/component/marker/MarkAreaView.js index 2325bbdbe0..74222275c7 100644 --- a/src/component/marker/MarkAreaView.js +++ b/src/component/marker/MarkAreaView.js @@ -223,21 +223,16 @@ define(function (require) { polygon.hoverStyle = itemModel.getModel('itemStyle.normal').getItemStyle(); - var defaultValue = areaData.getName(idx) || ''; - var textColor = color || polygon.style.fill; - - graphic.setText(polygon.style, labelModel, textColor); - polygon.style.text = labelModel.getShallow('show') - ? zrUtil.retrieve( - maModel.getFormattedLabel(idx, 'normal'), - defaultValue - ) - : null; - - graphic.setText(polygon.hoverStyle, labelHoverModel, false); - polygon.hoverStyle.text = labelHoverModel.getShallow('show') - ? maModel.getFormattedLabel(idx, 'emphasis') - : null; + graphic.setLabelStyle( + polygon.style, polygon.hoverStyle, labelModel, labelHoverModel, + { + labelFetcher: maModel, + labelDataIndex: idx, + defaultText: areaData.getName(idx) || '', + isRectText: true, + autoColor: color + } + ); graphic.setHoverStyle(polygon, {}); diff --git a/src/coord/geo/GeoModel.js b/src/coord/geo/GeoModel.js index f8196e3d17..9980d571cd 100644 --- a/src/coord/geo/GeoModel.js +++ b/src/coord/geo/GeoModel.js @@ -94,15 +94,11 @@ define(function (require) { label: { normal: { show: false, - textStyle: { - color: '#000' - } + color: '#000' }, emphasis: { show: true, - textStyle: { - color: 'rgb(100,0,0)' - } + color: 'rgb(100,0,0)' } }, @@ -147,8 +143,7 @@ define(function (require) { return formatter(params); } else if (typeof formatter === 'string') { - var serName = params.seriesName; - return formatter.replace('{a}', serName != null ? serName : ''); + return formatter.replace('{a}', name != null ? name : ''); } }, diff --git a/src/util/graphic.js b/src/util/graphic.js index 76723d97e2..a4c8a16020 100644 --- a/src/util/graphic.js +++ b/src/util/graphic.js @@ -413,15 +413,82 @@ define(function(require) { .on('normal', leaveEmphasis); }; + /** + * @param {Object|module:zrender/graphic/Style} normalStyle + * @param {Object} emphasisStyle + * @param {module:echarts/model/Model} normalModel + * @param {module:echarts/model/Model} emphasisModel + * @param {Object} opt Check `opt` of `setTextStyleCommon` to find other props. + * @param {Object} [opt.defaultText] + * @param {module:echarts/model/Model} [opt.labelFetcher] Fetch text by + * `opt.labelFetcher.getFormattedLabel(opt.labelDataIndex, 'normal'/'emphasis', null, opt.labelDimIndex)` + * @param {module:echarts/model/Model} [opt.labelDataIndex] Fetch text by + * `opt.textFetcher.getFormattedLabel(opt.labelDataIndex, 'normal'/'emphasis', null, opt.labelDimIndex)` + * @param {module:echarts/model/Model} [opt.labelDimIndex] Fetch text by + * `opt.textFetcher.getFormattedLabel(opt.labelDataIndex, 'normal'/'emphasis', null, opt.labelDimIndex)` + * @param {Object} [normalSpecified] + * @param {Object} [emphasisSpecified] + */ + graphic.setLabelStyle = function ( + normalStyle, emphasisStyle, + normalModel, emphasisModel, + opt, + normalSpecified, emphasisSpecified + ) { + opt = opt || EMPTY_OBJ; + var labelFetcher = opt.labelFetcher; + var labelDataIndex = opt.labelDataIndex; + var labelDimIndex = opt.labelDimIndex; + + // This scenario, `label.normal.show = true; label.emphasis.show = false`, + // is not supported util someone requests. + + // Consider performance, only fetch label when necessary. + var normalStyleText = normalModel.getShallow('show') + ? zrUtil.retrieve2( + labelFetcher + ? labelFetcher.getFormattedLabel(labelDataIndex, 'normal', null, labelDimIndex) + : null, + opt.defaultText + ) + : null; + var emphasisStyleText = emphasisModel.getShallow('show') + ? zrUtil.retrieve2( + labelFetcher + ? labelFetcher.getFormattedLabel(labelDataIndex, 'emphasis', null, labelDimIndex) + : null, + normalStyleText + ) + : null; + + // Optimize: If style.text is null, text will not be drawn. + if (normalStyleText != null || emphasisStyleText != null) { + // Always set `textStyle` even if `normalStyle.text` is null, because default + // values have to be set on `normalStyle`. + // If we set default values on `emphasisStyle`, consider case: + // Firstly, `setOption(... label: {normal: {text: null}, emphasis: {show: true}} ...);` + // Secondly, `setOption(... label: {noraml: {show: true, text: 'abc', color: 'red'} ...);` + // Then the 'red' will not work on emphasis. + setTextStyle(normalStyle, normalModel, normalSpecified, opt); + setTextStyle(emphasisStyle, emphasisModel, emphasisSpecified, opt, true); + } + + normalStyle.text = normalStyleText; + emphasisStyle.text = emphasisStyleText; + }; + /** * Set basic textStyle properties. * @param {Object|module:zrender/graphic/Style} textStyle * @param {module:echarts/model/Model} model * @param {Object} [specifiedTextStyle] Can be overrided by settings in model. * @param {Object} [opt] See `opt` of `setTextStyleCommon`. + * @param {boolean} [noDefault] */ - graphic.setTextStyle = function (textStyle, textStyleModel, specifiedTextStyle, opt) { - setTextStyleCommon(textStyle, textStyleModel, opt); + var setTextStyle = graphic.setTextStyle = function ( + textStyle, textStyleModel, specifiedTextStyle, opt, noDefault + ) { + setTextStyleCommon(textStyle, textStyleModel, opt, noDefault); specifiedTextStyle && zrUtil.extend(textStyle, specifiedTextStyle); textStyle.host && textStyle.host.dirty && textStyle.host.dirty(false); @@ -429,7 +496,8 @@ define(function(require) { }; /** - * Set text option in the style + * Set text option in the style. + * @deprecated * @param {Object} textStyle * @param {module:echarts/model/Model} labelModel * @param {string|boolean} defaultColor Default text color. @@ -437,19 +505,21 @@ define(function(require) { */ graphic.setText = function (textStyle, labelModel, defaultColor) { var opt = {isRectText: true}; + var noDefault; + if (defaultColor === false) { - opt.forMerge = true; + noDefault = true; } else { // Support setting color as 'auto' to get visual color. - opt.defaultTextColor = opt.autoColor = defaultColor; - opt.checkInside = checkInsideForSetText; + opt.autoColor = defaultColor; + opt.checkInside = defaultCheckInside; } - setTextStyleCommon(textStyle, labelModel, opt); + setTextStyleCommon(textStyle, labelModel, opt, noDefault); textStyle.host && textStyle.host.dirty && textStyle.host.dirty(false); }; - function checkInsideForSetText(labelModel, textPosition) { + function defaultCheckInside(labelModel, textPosition) { return textPosition && textPosition.indexOf('inside') >= 0; } @@ -458,20 +528,20 @@ define(function(require) { * disableBox: boolean, Whether diable drawing box of block (outer most). * isRectText: boolean, * autoColor: string, specify a color when color is 'auto', - * for textFill, textStroke, textBackgroundColor, and textBorderColor, - * defaultTextColor: string, - * checkInside: function, higher priority than `defaultTextColor`. - * forceRich: boolean, - * forMerge: boolean + * for textFill, textStroke, textBackgroundColor, and textBorderColor. + * If autoColor specified, it is used as default textFill. + * checkInside: function, if not set as `false` and not a function and isRectText is `true` and + * use defaultCheckInside by default. + * forceRich: boolean * } */ - function setTextStyleCommon(textStyle, textStyleModel, opt) { + function setTextStyleCommon(textStyle, textStyleModel, opt, noDefault) { // Consider there will be abnormal when merge hover style to normal style if given default value. opt = opt || EMPTY_OBJ; if (opt.isRectText) { var textPosition = textStyleModel.getShallow('position') - || (opt.forMerge ? null : 'inside'); + || (noDefault ? null : 'inside'); // 'outside' is not a valid zr textPostion value, but used // in bar series, and magric type should be considered. textPosition === 'outside' && (textPosition = 'top'); @@ -481,7 +551,7 @@ define(function(require) { labelRotate != null && (labelRotate *= Math.PI / 180); textStyle.textRotation = labelRotate; textStyle.textDistance = zrUtil.retrieve2( - textStyleModel.getShallow('distance'), opt.forMerge ? null : 5 + textStyleModel.getShallow('distance'), noDefault ? null : 5 ); } @@ -513,13 +583,13 @@ define(function(require) { // Cascade is supported in rich. var richTextStyle = textStyleModel.getModel(['rich', name]); // In rich, never `disableBox`. - setTokenTextStyle(richResult[name] = {}, richTextStyle, globalTextStyle, opt); + setTokenTextStyle(richResult[name] = {}, richTextStyle, globalTextStyle, opt, noDefault); } } } textStyle.rich = richResult; - setTokenTextStyle(textStyle, textStyleModel, globalTextStyle, opt, true); + setTokenTextStyle(textStyle, textStyleModel, globalTextStyle, opt, noDefault, true); if (opt.forceRich && !opt.textStyle) { opt.textStyle = {}; @@ -562,34 +632,37 @@ define(function(require) { return richItemNameMap; } - function setTokenTextStyle(textStyle, textStyleModel, globalTextStyle, opt, isBlock) { - var forMerge = opt.forMerge; - + function setTokenTextStyle(textStyle, textStyleModel, globalTextStyle, opt, noDefault, isBlock) { // In merge mode, default value should not be given. - globalTextStyle = !forMerge && globalTextStyle || EMPTY_OBJ; + globalTextStyle = !noDefault && globalTextStyle || EMPTY_OBJ; - var textFill = getAutoColor(textStyleModel.getShallow('color')); - var textStroke = getAutoColor(textStyleModel.getShallow('textBorderColor')); + var textFill = getAutoColor(textStyleModel.getShallow('color'), opt); + var textStroke = getAutoColor(textStyleModel.getShallow('textBorderColor'), opt); var textLineWidth = textStyleModel.getShallow('textBorderWidth'); - if (!forMerge) { + if (!noDefault) { textFill == null && (textFill = globalTextStyle.color); textStroke == null && (textStroke = globalTextStyle.textBorderColor); textLineWidth == null && (textLineWidth = globalTextStyle.textBorderWidth); + var checkInside = opt.checkInside; + !checkInside && opt.isRectText && checkInside !== false && ( + checkInside = defaultCheckInside + ); + if (textFill == null - && opt.checkInside - && opt.checkInside(textStyleModel, textStyle.textPosition) + && checkInside + && checkInside(textStyleModel, textStyle.textPosition) ) { textFill = '#fff'; // Consider text with #fff overflow its container. if (textStroke == null) { - textStroke = opt.defaultTextColor; + textStroke = opt.autoColor; textLineWidth == null && (textLineWidth = 2); } } - textFill == null && (textFill = opt.defaultTextColor); + textFill == null && (textFill = opt.autoColor); } textStyle.textFill = textFill;