You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by su...@apache.org on 2018/09/21 16:58:55 UTC

[incubator-echarts] branch master updated (dc95d85 -> 90696f7)

This is an automated email from the ASF dual-hosted git repository.

sushuang pushed a change to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git.


    from dc95d85  Merge branch 'master' of https://github.com/apache/incubator-echarts
     new 1357fee  (fix): fix pie high down and tweak graphic high down.
     new 5d42bcc  Merge branch 'master' of https://github.com/apache/incubator-echarts
     new 90696f7  fix: code style and clarify eslint.

The 3 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.


Summary of changes:
 .eslintrc.yaml                   | 59 ++++++++++++++--------------
 src/chart/custom.js              |  2 +-
 src/chart/funnel/funnelLayout.js |  6 ++-
 src/chart/helper/Symbol.js       | 21 +---------
 src/chart/pie/PieView.js         |  8 +---
 src/util/graphic.js              | 84 +++++++++++++++++++++++++++-------------
 src/view/Chart.js                | 19 +++++----
 test/hoverStyle.html             | 55 ++++++++++++++++++++++++++
 8 files changed, 163 insertions(+), 91 deletions(-)


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org


[incubator-echarts] 01/03: (fix): fix pie high down and tweak graphic high down.

Posted by su...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

sushuang pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git

commit 1357fee6e4093dcbd8d6ca3f828bf34ed0fa9fff
Author: sushuang <su...@gmail.com>
AuthorDate: Fri Sep 21 23:55:47 2018 +0800

    (fix): fix pie high down and tweak graphic high down.
---
 src/chart/custom.js        |  2 +-
 src/chart/helper/Symbol.js | 21 ++----------
 src/chart/pie/PieView.js   |  8 ++---
 src/util/graphic.js        | 84 +++++++++++++++++++++++++++++++---------------
 src/view/Chart.js          | 19 +++++++----
 test/hoverStyle.html       | 55 ++++++++++++++++++++++++++++++
 6 files changed, 129 insertions(+), 60 deletions(-)

diff --git a/src/chart/custom.js b/src/chart/custom.js
index 98f7ead..8a423ac 100644
--- a/src/chart/custom.js
+++ b/src/chart/custom.js
@@ -327,7 +327,7 @@ function updateEl(el, dataIndex, elOption, animatableModel, data, isInit, isRoot
         graphicUtil.setElementHoverStyle(el, styleEmphasis);
         el.__cusHasEmphStl = !disableStyleEmphasis;
     }
-    isRoot && graphicUtil.setAsHoverStyleTrigger(el, !disableStyleEmphasis);
+    isRoot && graphicUtil.setAsHighDownDispatcher(el, !disableStyleEmphasis);
 }
 
 function prepareStyleTransition(prop, targetStyle, elOptionStyle, oldElStyle, isInit) {
diff --git a/src/chart/helper/Symbol.js b/src/chart/helper/Symbol.js
index d55dc6e..1090798 100644
--- a/src/chart/helper/Symbol.js
+++ b/src/chart/helper/Symbol.js
@@ -321,10 +321,7 @@ symbolProto._updateCommon = function (data, idx, symbolSize, seriesScope) {
         return useNameLabel ? data.getName(idx) : getDefaultLabel(data, idx);
     }
 
-    symbolPath.off('mouseover')
-        .off('mouseout')
-        .off('emphasis')
-        .off('normal');
+    graphic.removeExtraHighDownEffect(symbolPath);
 
     symbolPath.hoverStyle = hoverItemStyle;
 
@@ -335,24 +332,10 @@ symbolProto._updateCommon = function (data, idx, symbolSize, seriesScope) {
     symbolPath.__symbolOriginalScale = getScale(symbolSize);
 
     if (hoverAnimation && seriesModel.isAnimationEnabled()) {
-        // Note: consider `off`, should use static function here.
-        symbolPath.on('mouseover', onMouseOver)
-            .on('mouseout', onMouseOut)
-            .on('emphasis', onEmphasis)
-            .on('normal', onNormal);
+        graphic.setExtraHighDownEffect(symbolPath, onEmphasis, onNormal);
     }
 };
 
-function onMouseOver() {
-    // see comment in `graphic.isInEmphasis`
-    !graphic.isInEmphasis(this) && onEmphasis.call(this);
-}
-
-function onMouseOut() {
-    // see comment in `graphic.isInEmphasis`
-    !graphic.isInEmphasis(this) && onNormal.call(this);
-}
-
 function onEmphasis() {
     // Do not support this hover animation util some scenario required.
     // Animation can only be supported in hover layer when using `el.incremetal`.
diff --git a/src/chart/pie/PieView.js b/src/chart/pie/PieView.js
index 199ec24..9913838 100644
--- a/src/chart/pie/PieView.js
+++ b/src/chart/pie/PieView.js
@@ -197,13 +197,9 @@ piePieceProto.updateData = function (data, idx, firstCreate) {
             }
         }, 300, 'elasticOut');
     }
-    sector.off('mouseover').off('mouseout').off('emphasis').off('normal');
+    graphic.removeExtraHighDownEffect(sector);
     if (itemModel.get('hoverAnimation') && seriesModel.isAnimationEnabled()) {
-        sector
-            .on('mouseover', onEmphasis)
-            .on('mouseout', onNormal)
-            .on('emphasis', onEmphasis)
-            .on('normal', onNormal);
+        graphic.setExtraHighDownEffect(sector, onEmphasis, onNormal);
     }
 
     this._updateLabel(data, idx);
diff --git a/src/util/graphic.js b/src/util/graphic.js
index f44b844..c24b089 100644
--- a/src/util/graphic.js
+++ b/src/util/graphic.js
@@ -274,7 +274,7 @@ function cacheElementStl(el) {
     var elStyle = el.style;
 
     for (var name in hoverStyle) {
-        // See comment in `doSingleEnterHover`.
+        // See comment in `singleEnterEmphasis`.
         if (hoverStyle[name] != null) {
             normalStyle[name] = elStyle[name];
         }
@@ -285,7 +285,7 @@ function cacheElementStl(el) {
     normalStyle.stroke = elStyle.stroke;
 }
 
-function doSingleEnterHover(el) {
+function singleEnterEmphasis(el) {
     var hoverStl = el.__hoverStl;
 
     if (!hoverStl || el.__highlighted) {
@@ -347,6 +347,8 @@ function doSingleEnterHover(el) {
         el.dirty(false);
         el.z2 += 1;
     }
+
+    el.__extraOnEmphasis && el.__extraOnEmphasis();
 }
 
 function setDefaultHoverFillStroke(targetStyle, hoverStyle, prop) {
@@ -355,9 +357,12 @@ function setDefaultHoverFillStroke(targetStyle, hoverStyle, prop) {
     }
 }
 
-function doSingleLeaveHover(el) {
+function singleEnterNormal(el) {
     if (el.__highlighted) {
         doSingleRestoreHoverStyle(el);
+
+        el.__extraOnNormal && el.__extraOnNormal();
+
         el.__highlighted = false;
     }
 }
@@ -404,31 +409,48 @@ function traverseCall(el, method) {
  *        as `false` to disable the hover style.
  *        Otherwise, use the default hover style if not provided.
  * @param {Object} [opt]
- * @param {boolean} [opt.hoverSilentOnTouch=false] See `graphic.setAsHoverStyleTrigger`
+ * @param {boolean} [opt.hoverSilentOnTouch=false] See `graphic.setAsHighDownDispatcher`
  */
 export function setElementHoverStyle(el, hoverStl) {
     hoverStl = el.__hoverStl = hoverStl !== false && (hoverStl || {});
     el.__hoverStlDirty = true;
 
     if (el.__highlighted) {
-        doSingleLeaveHover(el);
-        doSingleEnterHover(el);
+        singleEnterNormal(el);
+        singleEnterEmphasis(el);
     }
 }
 
 /**
- * Emphasis (called by API) has higher priority than `mouseover`.
+ * Set customized emphasis effect like scale, animation.
+ * If calling this method more than once with the same
+ * `onEmphasis` and `onNormal` function, it will not
+ * add but do nothing.
+ *
+ * Highlight that triggered by API (
+ *     `chart.dispatchAction({type: 'highlight'});`
+ *     or `el.trigger('emphasis');`
+ * ) has higher priority than that triggered by `mouseover`.
  * When element has been called to be entered emphasis, mouse over
  * should not trigger the highlight effect (for example, animation
  * scale) again, and `mouseout` should not downplay the highlight
  * effect. So the listener of `mouseover` and `mouseout` should
  * check `isInEmphasis`.
  *
- * @param {module:zrender/Element} el
- * @return {boolean}
+ * @param {module:zrender/src/Element} el element that will take the effect.
+ * @param {Function} onEmphasis
+ * @param {Function} onNormal
  */
-export function isInEmphasis(el) {
-    return el && el.__isEmphasisEntered;
+export function setExtraHighDownEffect(el, onEmphasis, onNormal) {
+    el.__extraOnEmphasis = onEmphasis;
+    el.__extraOnNormal = onNormal;
+}
+
+/**
+ * @param {module:zrender/src/Element} el element that will take the effect.
+ */
+export function removeExtraHighDownEffect(el) {
+    el.__extraOnEmphasis = el.__extraOnNormal = null;
 }
 
 function onElementMouseOver(e) {
@@ -436,8 +458,8 @@ function onElementMouseOver(e) {
         return;
     }
 
-    // Only if element is not in emphasis status
-    !this.__isEmphasisEntered && traverseCall(this, doSingleEnterHover);
+    // API highlight has higher priority than mouse highlight.
+    !this.__doesEmphasisEnteredByAPI && traverseCall(this, singleEnterEmphasis);
 }
 
 function onElementMouseOut(e) {
@@ -445,18 +467,18 @@ function onElementMouseOut(e) {
         return;
     }
 
-    // Only if element is not in emphasis status
-    !this.__isEmphasisEntered && traverseCall(this, doSingleLeaveHover);
+    // API highlight has higher priority than mouse highlight.
+    !this.__doesEmphasisEnteredByAPI && traverseCall(this, singleEnterNormal);
 }
 
-function enterEmphasis() {
-    this.__isEmphasisEntered = true;
-    traverseCall(this, doSingleEnterHover);
+function onEnterEmphasisByAPI() {
+    this.__doesEmphasisEnteredByAPI = true;
+    traverseCall(this, singleEnterEmphasis);
 }
 
-function leaveEmphasis() {
-    this.__isEmphasisEntered = false;
-    traverseCall(this, doSingleLeaveHover);
+function onEnterNormalByAPI() {
+    this.__doesEmphasisEnteredByAPI = false;
+    traverseCall(this, singleEnterNormal);
 }
 
 /**
@@ -474,7 +496,7 @@ function leaveEmphasis() {
  * @param {module:zrender/Element} el
  * @param {Object|boolean} [hoverStyle] See `graphic.setElementHoverStyle`.
  * @param {Object} [opt]
- * @param {boolean} [opt.hoverSilentOnTouch=false] See `graphic.setAsHoverStyleTrigger`.
+ * @param {boolean} [opt.hoverSilentOnTouch=false] See `graphic.setAsHighDownDispatcher`.
  */
 export function setHoverStyle(el, hoverStyle, opt) {
     el.isGroup
@@ -485,7 +507,7 @@ export function setHoverStyle(el, hoverStyle, opt) {
         })
         : setElementHoverStyle(el, el.hoverStyle || hoverStyle);
 
-    setAsHoverStyleTrigger(el, opt);
+    setAsHighDownDispatcher(el, opt);
 }
 
 /**
@@ -501,25 +523,33 @@ export function setHoverStyle(el, hoverStyle, opt) {
  *        In this case, hoverSilentOnTouch should be used to disable hover-highlight
  *        on touch device.
  */
-export function setAsHoverStyleTrigger(el, opt) {
+export function setAsHighDownDispatcher(el, opt) {
     var disable = opt === false;
     el.__hoverSilentOnTouch = opt != null && opt.hoverSilentOnTouch;
 
     // Simple optimize, since this method might be
     // called for each elements of a group in some cases.
-    if (!disable || el.__hoverStyleTrigger) {
+    if (!disable || el.__highDownDispatcher) {
         var method = disable ? 'off' : 'on';
 
         // Duplicated function will be auto-ignored, see Eventful.js.
         el[method]('mouseover', onElementMouseOver)[method]('mouseout', onElementMouseOut);
         // Emphasis, normal can be triggered manually
-        el[method]('emphasis', enterEmphasis)[method]('normal', leaveEmphasis);
+        el[method]('emphasis', onEnterEmphasisByAPI)[method]('normal', onEnterNormalByAPI);
 
-        el.__hoverStyleTrigger = !disable;
+        el.__highDownDispatcher = !disable;
     }
 }
 
 /**
+ * @param {module:zrender/src/Element} el
+ * @return {boolean}
+ */
+export function isHighDownDispatcher(el) {
+    return !!(el && el.__highDownDispatcher);
+}
+
+/**
  * @param {Object|module:zrender/graphic/Style} normalStyle
  * @param {Object} emphasisStyle
  * @param {module:echarts/model/Model} normalModel
diff --git a/src/view/Chart.js b/src/view/Chart.js
index 47485d8..7c71b01 100644
--- a/src/view/Chart.js
+++ b/src/view/Chart.js
@@ -22,6 +22,7 @@ import Group from 'zrender/src/container/Group';
 import * as componentUtil from '../util/component';
 import * as clazzUtil from '../util/clazz';
 import * as modelUtil from '../util/model';
+import * as graphicUtil from '../util/graphic';
 import {createTask} from '../stream/task';
 import createRenderPlanner from '../chart/helper/createRenderPlanner';
 
@@ -165,23 +166,27 @@ chartProto.updateView
 
 /**
  * Set state of single element
- * @param  {module:zrender/Element} el
- * @param  {string} state
+ * @param {module:zrender/Element} el
+ * @param  {string} state 'normal'|'emphasis'
  */
 function elSetState(el, state) {
     if (el) {
         el.trigger(state);
-        if (el.type === 'group') {
-            for (var i = 0; i < el.childCount(); i++) {
+        if (el.isGroup
+            // Simple optimize.
+            && !graphicUtil.isHighDownDispatcher(el)
+        ) {
+            for (var i = 0, len = el.childCount(); i < len; i++) {
                 elSetState(el.childAt(i), state);
             }
         }
     }
 }
+
 /**
- * @param  {module:echarts/data/List} data
- * @param  {Object} payload
- * @param  {string} state 'normal'|'emphasis'
+ * @param {module:echarts/data/List} data
+ * @param {Object} payload
+ * @param {string} state 'normal'|'emphasis'
  */
 function toggleHighlight(data, payload, state) {
     var dataIndex = modelUtil.queryDataIndex(data, payload);
diff --git a/test/hoverStyle.html b/test/hoverStyle.html
index 83b9b78..40fffb7 100644
--- a/test/hoverStyle.html
+++ b/test/hoverStyle.html
@@ -59,6 +59,7 @@ under the License.
         <div id="main3"></div>
         <div id="main4"></div>
         <div id="main5"></div>
+        <div id="main6"></div>
 
 
         <script>
@@ -492,5 +493,59 @@ under the License.
 
 
 
+
+
+
+        <script>
+            require(['echarts'], function (echarts) {
+                var option = {
+                    hoverLayerThreshold: hoverLayerThreshold,
+                    tooltip: {},
+                    series: [{
+                        type: 'pie',
+                        data: [
+                            {value: 12, name: 'qwer'},
+                            {value: 15, name: 'asdf'},
+                            {value: 17, name: 'zxcv'}
+                        ]
+                    }]
+                };
+
+                var chart = testHelper.create(echarts, 'main6', {
+                    title: [
+                        'Pie **hightlight priority** of API and mouse:',
+                        'Hover on sector, **should scaled and highlighted**.',
+                        'trigger hover by API: **should scaled and highlighted**.',
+                        'Test mouse hover and leave, should NOT return to normal.',
+                        'Only click downplay to return normal'
+                    ],
+                    option: option,
+                    height: 200,
+                    buttons: [{
+                        text: 'highlight dataIndex 0',
+                        onclick: function () {
+                            chart.dispatchAction({
+                                type: 'highlight',
+                                seriesIndex: 0,
+                                dataIndex: 0
+                            });
+                        }
+                    }, {
+                        text: 'downplay dataIndex 0',
+                        onclick: function () {
+                            chart.dispatchAction({
+                                type: 'downplay',
+                                seriesIndex: 0,
+                                dataIndex: 0
+                            });
+                        }
+                    }]
+                });
+            });
+        </script>
+
+
+
+
     </body>
 </html>
\ No newline at end of file


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org


[incubator-echarts] 02/03: Merge branch 'master' of https://github.com/apache/incubator-echarts

Posted by su...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

sushuang pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git

commit 5d42bcc280de18194db3271789e9f3bce4994e29
Merge: 1357fee dc95d85
Author: sushuang <su...@gmail.com>
AuthorDate: Sat Sep 22 00:15:23 2018 +0800

    Merge branch 'master' of https://github.com/apache/incubator-echarts

 src/chart/funnel/funnelLayout.js         | 21 ++++++++++++++++-----
 src/chart/sankey/SankeySeries.js         | 10 +++++++++-
 src/chart/themeRiver/ThemeRiverSeries.js |  8 +++-----
 test/funnel.html                         | 22 ++++++++++++++++------
 4 files changed, 44 insertions(+), 17 deletions(-)


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org


[incubator-echarts] 03/03: fix: code style and clarify eslint.

Posted by su...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

sushuang pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git

commit 90696f7f58ecd1192bea14af067d00d438c84051
Author: sushuang <su...@gmail.com>
AuthorDate: Sat Sep 22 00:58:30 2018 +0800

    fix: code style and clarify eslint.
---
 .eslintrc.yaml                   | 59 ++++++++++++++++++++--------------------
 src/chart/funnel/funnelLayout.js |  6 ++--
 2 files changed, 34 insertions(+), 31 deletions(-)

diff --git a/.eslintrc.yaml b/.eslintrc.yaml
index 7d18fe3..32f9d78 100644
--- a/.eslintrc.yaml
+++ b/.eslintrc.yaml
@@ -15,15 +15,15 @@ rules:
             allow:
                 - "warn"
                 - "error"
-    no-constant-condition: 1
+    no-constant-condition: 0
     comma-dangle: 2
     no-debugger: 2
-    no-dupe-keys: 1
+    no-dupe-keys: 2
     no-empty-character-class: 2
     no-ex-assign: 2
-    no-extra-boolean-cast: 1
-    no-func-assign: 1
-    no-inner-declarations: 1
+    no-extra-boolean-cast: 0
+    no-func-assign: 2
+    no-inner-declarations: 2
     no-invalid-regexp: 2
     no-negated-in-lhs: 2
     no-obj-calls: 2
@@ -31,55 +31,56 @@ rules:
     no-unreachable: 2
     use-isnan: 2
     valid-typeof: 2
+    block-scoped-var: 0
     curly:
         - 2
         - "all"
     eqeqeq:
         - 2
         - "allow-null"
-    guard-for-in: 1
+    guard-for-in: 2
     no-else-return: 0
     no-labels:
-        - 1
+        - 2
         -
             allowLoop: true
-    no-eval: 1
+    no-eval: 2
     no-extend-native: 2
-    no-extra-bind: 1
-    no-implied-eval: 1
+    no-extra-bind: 0
+    no-implied-eval: 2
     no-iterator: 2
-    no-irregular-whitespace: 1
-    no-lone-blocks: 1
-    no-loop-func: 1
-    no-multi-str: 1
+    no-irregular-whitespace: 2
+    no-lone-blocks: 2
+    no-loop-func: 2
+    no-multi-str: 2
     no-native-reassign: 2
     no-new-wrappers: 2
-    no-octal: 1
-    no-octal-escape: 1
+    no-octal: 2
+    no-octal-escape: 2
     no-proto: 2
     no-redeclare: 0
     no-self-compare: 2
     no-unneeded-ternary: 2
-    no-with: 1
+    no-with: 2
     radix: 2
     wrap-iife:
         - 2
         - "any"
-    no-delete-var: 1
+    no-delete-var: 2
     no-dupe-args: 2
     no-duplicate-case: 2
-    no-label-var: 1
+    no-label-var: 2
     no-shadow-restricted-names: 2
     no-undef: 2
     no-undef-init: 2
     no-unused-vars:
-        - 1
+        - 2
         -
             vars: "local"
             args: "none"
     no-use-before-define: 0
     brace-style:
-        - 1
+        - 2
         - "stroustrup"
         - {}
     comma-spacing:
@@ -90,7 +91,7 @@ rules:
     comma-style:
         - 2
         - "last"
-    new-parens: 1
+    new-parens: 2
     no-array-constructor: 2
     no-multi-spaces:
         - 2
@@ -138,7 +139,7 @@ rules:
     space-in-parens:
         - 2
         - "never"
-    space-unary-ops: 1
+    space-unary-ops: 2
     spaced-comment: 0
 
     max-nested-callbacks:
@@ -171,14 +172,14 @@ rules:
         - 2
         -
             allowParens: true
-    no-class-assign: 1
+    no-class-assign: 2
     no-const-assign: 2
-    no-dupe-class-members: 1
-    no-this-before-super: 1
+    no-dupe-class-members: 2
+    no-this-before-super: 0
     no-var: 0
-    no-duplicate-imports: 1
+    no-duplicate-imports: 2
     prefer-rest-params: 0
-    unicode-bom: 1
+    unicode-bom: 2
     max-statements-per-line: 2
 
-    no-useless-constructor: 1
\ No newline at end of file
+    no-useless-constructor: 0
\ No newline at end of file
diff --git a/src/chart/funnel/funnelLayout.js b/src/chart/funnel/funnelLayout.js
index 5ac9ba6..ee133c3 100644
--- a/src/chart/funnel/funnelLayout.js
+++ b/src/chart/funnel/funnelLayout.js
@@ -77,11 +77,13 @@ function labelLayout(data) {
                 textX = (points[0][0] + points[3][0]) / 2 + 5;
                 textY = (points[0][1] + points[3][1]) / 2;
                 textAlign = 'left';
-            } else if (labelPosition === 'insideRight') {
+            }
+            else if (labelPosition === 'insideRight') {
                 textX = (points[1][0] + points[2][0]) / 2 - 5;
                 textY = (points[1][1] + points[2][1]) / 2;
                 textAlign = 'right';
-            } else {
+            }
+            else {
                 textX = (points[0][0] + points[1][0] + points[2][0] + points[3][0]) / 4;
                 textY = (points[0][1] + points[1][1] + points[2][1] + points[3][1]) / 4;
                 textAlign = 'center';


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org