tweak emphasis text style.

src/chart/bar/BarView.js

@@ -181,7 +181,7 @@ define(function (require) {
 
     function removeRect(dataIndex, animationModel, el) {
         // Not show text when animating
-        el.style.text = '';
+        el.style.text = null;
         graphic.updateProps(el, {
             shape: {
                 width: 0
@@ -193,7 +193,7 @@ define(function (require) {
 
     function removeSector(dataIndex, animationModel, el) {
         // Not show text when animating
-        el.style.text = '';
+        el.style.text = null;
         graphic.updateProps(el, {
             shape: {
                 r: el.shape.r0

src/chart/bar/PictorialBarView.js

@@ -674,7 +674,7 @@ define(function (require) {
     function removeBar(data, dataIndex, animationModel, bar) {
         // Not show text when animating
         var labelRect = bar.__pictorialBarRect;
-        labelRect && (labelRect.style.text = '');
+        labelRect && (labelRect.style.text = null);
 
         var pathes = [];
         eachPath(bar, function (path) {

src/chart/bar/helper.js

@@ -22,7 +22,7 @@ define(function (require) {
             );
         }
         else {
-            normalStyle.text = '';
+            normalStyle.text = null;
         }
 
         if (hoverLabelModel.get('show')) {
@@ -32,16 +32,17 @@ define(function (require) {
                     seriesModel.getFormattedLabel(dataIndex, 'emphasis'),
                     seriesModel.getRawValue(dataIndex)
                 ),
-                labelPositionOutside
+                labelPositionOutside,
+                true
             );
         }
         else {
-            hoverStyle.text = '';
+            hoverStyle.text = null;
         }
     };
 
-    function setLabel(style, model, color, labelText, labelPositionOutside) {
-        graphic.setText(style, model, color);
+    function setLabel(style, model, color, labelText, labelPositionOutside, isEmphasis) {
+        graphic.setText(style, model, color, isEmphasis);
         style.text = labelText;
         if (style.textPosition === 'outside') {
             style.textPosition = labelPositionOutside;

src/chart/custom.js

@@ -362,7 +362,7 @@ define(function (require) {
 
             labelHelper.setTextToStyle(
                 data, dataIndexInside, currLabelValueDim, itemStyle,
-                customSeries, currLabelEmphasisModel, currVisualColor
+                customSeries, currLabelEmphasisModel, currVisualColor, true
             );
 
             extra && zrUtil.extend(itemStyle, extra);

src/chart/heatmap/HeatmapView.js

@@ -196,7 +196,7 @@ define(function (require) {
                     style.text = seriesModel.getFormattedLabel(idx, 'normal') || defaultText;
                 }
                 if (hoverLabelModel.getShallow('show')) {
-                    graphic.setText(hoverStl, hoverLabelModel);
+                    graphic.setText(hoverStl, hoverLabelModel, null, true);
                     hoverStl.text = seriesModel.getFormattedLabel(idx, 'emphasis') || defaultText;
                 }
 

src/chart/helper/Line.js

@@ -338,7 +338,7 @@ define(function (require) {
         }
         else {
             label.hoverStyle = {
-                text: ''
+                text: null
             };
         }
 

src/chart/helper/Symbol.js

@@ -228,7 +228,7 @@ define(function (require) {
             data, idx, valueDim, elStyle, seriesModel, labelModel, color
         );
         labelHelper.setTextToStyle(
-            data, idx, valueDim, hoverItemStyle, seriesModel, hoverLabelModel, color
+            data, idx, valueDim, hoverItemStyle, seriesModel, hoverLabelModel, color, true
         );
 
         symbolPath.off('mouseover')
@@ -269,7 +269,7 @@ define(function (require) {
         // Avoid mistaken hover when fading out
         this.silent = symbolPath.silent = true;
         // Not show text when animating
-        symbolPath.style.text = '';
+        symbolPath.style.text = null;
         graphic.updateProps(symbolPath, {
             scale: [0, 0]
         }, this._seriesModel, this.dataIndex, cb);

src/chart/helper/labelHelper.js

@@ -31,10 +31,10 @@ define(function (require) {
     };
 
     helper.setTextToStyle = function (
-        data, dataIndex, valueDim, elStyle, seriesModel, labelModel, color
+        data, dataIndex, valueDim, elStyle, seriesModel, labelModel, color, isEmphasis
     ) {
         if (valueDim != null && labelModel.getShallow('show')) {
-            graphic.setText(elStyle, labelModel, color);
+            graphic.setText(elStyle, labelModel, color, isEmphasis);
             elStyle.text = zrUtil.retrieve(
                 seriesModel.getFormattedLabel(dataIndex, 'normal'),
                 data.get(valueDim, dataIndex)

src/chart/radar/RadarView.js

@@ -174,21 +174,25 @@ define(function (require) {
                     var defaultText = data.get(data.dimensions[symbolPath.__dimIdx], idx);
                     graphic.setText(symbolPath.style, labelModel, color);
                     symbolPath.setStyle({
-                        text: labelModel.get('show') ? zrUtil.retrieve(
+                        text: labelModel.get('show')
+                            ? zrUtil.retrieve(
+                                seriesModel.getFormattedLabel(
+                                    idx, 'normal', null, symbolPath.__dimIdx
+                                ),
+                                defaultText
+                            )
+                            : null
+                    });
+
+                    graphic.setText(symbolPath.hoverStyle, labelHoverModel, color, true);
+                    symbolPath.hoverStyle.text = labelHoverModel.get('show')
+                        ? zrUtil.retrieve(
                             seriesModel.getFormattedLabel(
-                                idx, 'normal', null, symbolPath.__dimIdx
+                                idx, 'emphasis', null, symbolPath.__dimIdx
                             ),
                             defaultText
-                        ) : ''
-                    });
-
-                    graphic.setText(symbolPath.hoverStyle, labelHoverModel, color);
-                    symbolPath.hoverStyle.text = labelHoverModel.get('show') ? zrUtil.retrieve(
-                        seriesModel.getFormattedLabel(
-                            idx, 'emphasis', null, symbolPath.__dimIdx
-                        ),
-                        defaultText
-                    ) : '';
+                        )
+                        : null;
                 });
 
                 function onEmphasis() {

src/chart/treemap/Breadcrumb.js

@@ -100,7 +100,7 @@
                 if (totalWidth > availableSize.width) {
                     totalWidth -= itemWidth - emptyItemWidth;
                     itemWidth = emptyItemWidth;
-                    text = '';
+                    text = null;
                 }
 
                 var el = new graphic.Polygon({

src/chart/treemap/TreemapView.js

@@ -741,7 +741,7 @@
                 }
                 // For old bg.
                 else {
-                    normalStyle.text = emphasisStyle.text = '';
+                    normalStyle.text = emphasisStyle.text = null;
                 }
 
                 bg.setStyle(normalStyle);
@@ -818,14 +818,14 @@
             );
             setText(
                 text, emphasisStyle, nodeModel, upperLabelRect ? PATH_UPPERLABEL_EMPHASIS : PATH_LABEL_EMPHASIS,
-                visualColor, width, height, upperLabelRect
+                visualColor, width, height, upperLabelRect, true
             );
         }
 
-        function setText(text, style, nodeModel, labelPath, visualColor, width, height, upperLabelRect) {
+        function setText(text, style, nodeModel, labelPath, visualColor, width, height, upperLabelRect, isEmphasis) {
             var labelModel = nodeModel.getModel(labelPath);
 
-            graphic.setText(style, labelModel, visualColor);
+            graphic.setText(style, labelModel, visualColor, isEmphasis);
 
             upperLabelRect && (style.textPositionRect = zrUtil.clone(upperLabelRect));
 

src/component/marker/MarkAreaView.js

@@ -234,18 +234,18 @@ define(function (require) {
                     );
                 }
                 else {
-                    polygon.style.text = '';
+                    polygon.style.text = null;
                 }
 
                 if (labelHoverModel.getShallow('show')) {
-                    graphic.setText(polygon.hoverStyle, labelHoverModel, textColor);
+                    graphic.setTextStyle(polygon.hoverStyle, labelHoverModel, textColor, true);
                     polygon.hoverStyle.text = zrUtil.retrieve(
                         maModel.getFormattedLabel(idx, 'emphasis'),
                         defaultValue
                     );
                 }
                 else {
-                    polygon.hoverStyle.text = '';
+                    polygon.hoverStyle.text = null;
                 }
 
                 graphic.setHoverStyle(polygon, {});

src/util/graphic.js

@@ -263,11 +263,11 @@ define(function(require) {
             //         }
             //     }
             // },
-            // where properties of `emphasis` may not appear in `normal`. We previously use 
+            // where properties of `emphasis` may not appear in `normal`. We previously use
             // module:echarts/util/model#defaultEmphasis to merge `normal` to `emphasis`.
             // But consider rich text, it is impossible to cover all properties in merge.
-            // So we use merge mode when setting style here, where only properties that 
-            // is not `null/undefined` can be set. The disadventage: null/undefined can not 
+            // So we use merge mode when setting style here, where only properties that
+            // is not `null/undefined` can be set. The disadventage: null/undefined can not
             // be used to remove style any more in `emphasis`.
             el.style.extendFrom(el.__hoverStl);
             el.dirty(false);
@@ -290,7 +290,7 @@ define(function(require) {
             el.__zr && el.__zr.removeHover(el);
         }
         else {
-            // Consider null/undefined value, should use 
+            // Consider null/undefined value, should use
             // `setStyle` but not `extendFrom(stl, true)`.
             normalStl && el.setStyle(normalStl);
             el.z2 -= 1;
@@ -416,8 +416,8 @@ define(function(require) {
     /**
      * Set basic textStyle properties.
      * @param {Object|module:zrender/graphic/Style} style
-     * @param {Object} specifiedTextStyle Can be overrided by settings in model.
      * @param {module:echarts/model/Model} model
+     * @param {Object} [specifiedTextStyle] Can be overrided by settings in model.
      * @param {Object} [opt] See `opt` of `setTextStyleCommon`.
      */
     graphic.setTextStyle = function (style, textStyleModel, specifiedTextStyle, opt) {
@@ -433,12 +433,14 @@ define(function(require) {
      * @param {Object} textStyle
      * @param {module:echarts/model/Model} labelModel
      * @param {string} color
+     * @param {boolean} isEmphasis
      */
-    graphic.setText = function (textStyle, labelModel, color) {
-        setTextStyleCommon(textStyle, labelModel, {isRectText: true});
-
-        textStyle.textFill = textStyle.textFill
-            || (textStyle.textPosition.indexOf('inside') >= 0 ? 'white' : color);
+    graphic.setText = function (textStyle, labelModel, color, isEmphasis) {
+        setTextStyleCommon(textStyle, labelModel, {
+            isRectText: true,
+            forMerge: isEmphasis,
+            defaultTextColor: color
+        });
     };
 
     /**
@@ -446,18 +448,23 @@ 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
-     *      forceRich: boolean
+     *                 for textFill, textStroke, textBackgroundColor, and textBorderColor,
+     *      defaultTextColor: defaultTextColor,
+     *      forceRich: boolean,
+     *      forMerge: boolean
      * }
      */
     function setTextStyleCommon(textStyle, textStyleModel, opt) {
+        // Consider there will be abnormal when merge hover style to normal style if given default value.
+        var forMerge = opt && opt.forMerge;
+
         if (opt && opt.isRectText) {
-            textStyle.textPosition = textStyleModel.getShallow('position') || 'inside';
+            textStyle.textPosition = textStyleModel.getShallow('position') || (forMerge ? null : 'inside');
             textStyle.textOffset = textStyleModel.getShallow('offset');
             var labelRotate = textStyleModel.getShallow('rotate');
             labelRotate != null && (labelRotate *= Math.PI / 180);
             textStyle.textRotation = labelRotate;
-            textStyle.textDistance = textStyleModel.getShallow('distance') || 5;
+            textStyle.textDistance = textStyleModel.getShallow('distance') || (forMerge ? null : 5);
         }
 
         var ecModel = textStyleModel.ecModel;
@@ -488,7 +495,15 @@ define(function(require) {
     }
 
     function setTokenTextStyle(textStyle, textStyleModel, globalTextStyle, opt, isBlock) {
-        textStyle.textFill = getAutoColor(textStyleModel.getTextColor(), opt);
+        var textPosition = textStyle.textPosition;
+        textStyle.textFill = getAutoColor(textStyleModel.getTextColor(), opt) || (
+            (opt && opt.forMerge)
+                ? null
+                : (textPosition && textPosition.indexOf('inside') >= 0)
+                ? '#fff'
+                : (opt && opt.defaultTextColor)
+        );
+
         textStyle.textStroke = getAutoColor(
             textStyleModel.getShallow('textBorderColor')
                 || (globalTextStyle && globalTextStyle.textBorderColor)
@@ -762,5 +777,32 @@ define(function(require) {
         }
     };
 
+    /**
+     * @param {string} iconStr Support 'image://' or 'path://' or direct svg path.
+     * @param {Object} [opt] Properties of `module:zrender/Element`, except `style`.
+     * @param {Object} [rect] {x, y, width, height}
+     * @return {module:zrender/Element} Icon path or image element.
+     */
+    graphic.createIcon = function (iconStr, opt, rect) {
+        opt = zrUtil.extend({rectHover: true}, opt);
+        var style = opt.style = {strokeNoScale: true};
+        rect = rect || {x: -1, y: -1, width: 2, height: 2};
+
+        return iconStr.indexOf('image://') === 0
+            ? (
+                style.image = iconStr.slice(8),
+                zrUtil.defaults(style, rect),
+                new graphic.Image(opt)
+            )
+            : (
+                graphic.makePath(
+                    iconStr.replace('path://', ''),
+                    opt,
+                    rect,
+                    'center'
+                )
+            );
+    };
+
     return graphic;
 });

test/line.html

@@ -24,11 +24,13 @@
                 'echarts/component/legend',
                 'echarts/component/grid',
                 'echarts/component/tooltip',
-                'echarts/component/dataZoomInside'
+                'echarts/component/dataZoomInside',
+                'zrender/svg/svg'
             ], function (echarts) {
 
                 var chart = echarts.init(document.getElementById('main'), null, {
                     renderer: 'canvas'
+                    // renderer: 'svg'
                 });
 
                 var xAxisData = [];
@@ -130,9 +132,15 @@
                         type: 'line',
                         stack: 'all',
                         symbol: 'circle',
-                        symbolSize: 10,
+                        symbolSize: 40,
                         data: data1,
                         itemStyle: itemStyle,
+                        label: {
+                            normal: {
+                                show: true,
+                                fontSize: 12
+                            }
+                        },
                         lineStyle: {
                             normal: {
                                 shadowBlur: 4,