Map label improvement

src/chart/map/MapView.js

@@ -54,9 +54,6 @@ define(function (require) {
                 if (isNaN(value)) {
                     return;
                 }
-                var itemModel = data.getItemModel(idx);
-                var labelModel = itemModel.getModel('label.normal');
-                var textStyleModel = labelModel.getModel('textStyle');
 
                 var layout = data.getItemLayout(idx);
 
@@ -68,12 +65,6 @@ define(function (require) {
                 var point = layout.point;
                 var offset = layout.offset;
 
-                var showLabel = labelModel.get('show');
-
-                var labelText = data.getName(idx);
-                var labelColor = textStyleModel.getTextColor();
-                var labelFont = textStyleModel.getFont();
-
                 var circle = new graphic.Circle({
                     style: {
                         fill: data.getVisual('color')
@@ -87,13 +78,44 @@ define(function (require) {
                     z2: 10
                 });
 
-                if (showLabel && !offset) {
+                // First data on the same region
+                if (!offset) {
+                    var labelText = data.getName(idx);
+
+                    var itemModel = data.getItemModel(idx);
+                    var labelModel = itemModel.getModel('label.normal');
+                    var hoverLabelModel = itemModel.getModel('label.emphasis');
+
+                    var textStyleModel = labelModel.getModel('textStyle');
+                    var hoverTextStyleModel = hoverLabelModel.getModel('textStyle');
+
+                    var polygonGroups = data.getItemGraphicEl(idx);
                     circle.setStyle({
-                        text: labelText,
-                        textFill: labelColor,
-                        textPosition: 'bottom',
-                        textFont: labelFont
+                        textPosition: 'bottom'
                     });
+
+                    var onEmphasis = function () {
+                        circle.setStyle({
+                            text: hoverLabelModel.get('show') ? labelText : '',
+                            textFill: hoverTextStyleModel.getTextColor(),
+                            textFont: hoverTextStyleModel.getFont()
+                        });
+                    };
+
+                    var onNormal = function () {
+                        circle.setStyle({
+                            text: labelModel.get('show') ? labelText : '',
+                            textFill: textStyleModel.getTextColor(),
+                            textFont: textStyleModel.getFont()
+                        });
+                    };
+
+                    polygonGroups.on('mouseover', onEmphasis)
+                        .on('mouseout', onNormal)
+                        .on('emphasis', onEmphasis)
+                        .on('normal', onNormal);
+
+                    onNormal();
                 }
 
                 group.add(circle);

src/component/helper/MapDraw.js

@@ -167,11 +167,9 @@ define(function (require) {
                 // In the following cases label will be drawn
                 // 1. In map series and data value is NaN
                 // 2. In geo component
-                // 3. Data value is not NaN and label only shows on hover
                 // 4. Region has no series legendSymbol, which will be add a showLabel flag in mapSymbolLayout
                 if (
                     (!data || isDataNaN && (showLabel || hoverShowLabel))
-                 || (data && !isDataNaN && (!showLabel && hoverShowLabel))
                  || (itemLayout && itemLayout.showLabel)
                  ) {
                     var query = data ? dataIdx : region.name;