You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by sh...@apache.org on 2021/03/30 06:25:39 UTC

[echarts] branch resize-animation created (now 1fecb51)

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

shenyi pushed a change to branch resize-animation
in repository https://gitbox.apache.org/repos/asf/echarts.git.


      at 1fecb51  feat(animation): add animaiton configuration in resize

This branch includes the following new commits:

     new 1fecb51  feat(animation): add animaiton configuration in resize

The 1 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.


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


[echarts] 01/01: feat(animation): add animaiton configuration in resize

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

shenyi pushed a commit to branch resize-animation
in repository https://gitbox.apache.org/repos/asf/echarts.git

commit 1fecb51ae8db3f1416b037903f0f36205ab99d13
Author: pissang <bm...@gmail.com>
AuthorDate: Tue Mar 30 14:23:27 2021 +0800

    feat(animation): add animaiton configuration in resize
---
 src/core/echarts.ts                        |  35 +++++----
 src/echarts.ts                             |   2 +-
 test/resize-animation.html                 | 117 +++++++++++++++++++++++++++++
 test/runTest/actions/__meta__.json         |   1 +
 test/runTest/actions/resize-animation.json |   1 +
 5 files changed, 140 insertions(+), 16 deletions(-)

diff --git a/src/core/echarts.ts b/src/core/echarts.ts
index b272247..8c2371c 100644
--- a/src/core/echarts.ts
+++ b/src/core/echarts.ts
@@ -88,7 +88,8 @@ import {
     DimensionLoose,
     ScaleDataValue,
     ZRElementEventName,
-    ECElementEvent
+    ECElementEvent,
+    AnimationOption
 } from '../util/types';
 import Displayable from 'zrender/src/graphic/Displayable';
 import IncrementalDisplayable from 'zrender/src/graphic/IncrementalDisplayable';
@@ -210,7 +211,15 @@ export interface SetOptionTransitionOptItem {
     from?: SetOptionTransitionOptFinder;
     to: SetOptionTransitionOptFinder;
     dividingMethod: MorphDividingMethod;
-}
+};
+
+export interface ResizeOpts {
+    width?: number | 'auto', // Can be 'auto' (the same as null/undefined)
+    height?: number | 'auto', // Can be 'auto' (the same as null/undefined)
+    animation?: AnimationOption
+    silent?: boolean // by default false.
+};
+
 interface SetOptionTransitionOptFinder extends modelUtil.ModelFinderObject {
     dimension: DimensionLoose;
 }
@@ -1129,11 +1138,7 @@ class ECharts extends Eventful<ECEventDefinition> {
     /**
      * Resize the chart
      */
-    resize(opts?: {
-        width?: number | 'auto', // Can be 'auto' (the same as null/undefined)
-        height?: number | 'auto', // Can be 'auto' (the same as null/undefined)
-        silent?: boolean // by default false.
-    }): void {
+    resize(opts?: ResizeOpts): void {
         if (__DEV__) {
             assert(!this[IN_MAIN_PROCESS_KEY], '`resize` should not be called during main process.');
         }
@@ -1162,10 +1167,10 @@ class ECharts extends Eventful<ECEventDefinition> {
         optionChanged && prepare(this);
         updateMethods.update.call(this, {
             type: 'resize',
-            animation: {
+            animation: zrUtil.extend({
                 // Disable animation
                 duration: 0
-            }
+            }, opts && opts.animation)
         });
 
         this[IN_MAIN_PROCESS_KEY] = false;
@@ -1504,12 +1509,12 @@ class ECharts extends Eventful<ECEventDefinition> {
 
         updateMethods = {
 
-            prepareAndUpdate: function (this: ECharts, payload: Payload): void {
+            prepareAndUpdate(this: ECharts, payload: Payload): void {
                 prepare(this);
                 updateMethods.update.call(this, payload);
             },
 
-            update: function (this: ECharts, payload: Payload): void {
+            update(this: ECharts, payload: Payload): void {
                 // console.profile && console.profile('update');
 
                 const ecModel = this._model;
@@ -1581,7 +1586,7 @@ class ECharts extends Eventful<ECEventDefinition> {
                 // console.profile && console.profileEnd('update');
             },
 
-            updateTransform: function (this: ECharts, payload: Payload): void {
+            updateTransform(this: ECharts, payload: Payload): void {
                 const ecModel = this._model;
                 const api = this._api;
 
@@ -1638,7 +1643,7 @@ class ECharts extends Eventful<ECEventDefinition> {
                 performPostUpdateFuncs(ecModel, this._api);
             },
 
-            updateView: function (this: ECharts, payload: Payload): void {
+            updateView(this: ECharts, payload: Payload): void {
                 const ecModel = this._model;
 
                 // update before setOption
@@ -1660,7 +1665,7 @@ class ECharts extends Eventful<ECEventDefinition> {
                 performPostUpdateFuncs(ecModel, this._api);
             },
 
-            updateVisual: function (this: ECharts, payload: Payload): void {
+            updateVisual(this: ECharts, payload: Payload): void {
                 // updateMethods.update.call(this, payload);
 
                 const ecModel = this._model;
@@ -1701,7 +1706,7 @@ class ECharts extends Eventful<ECEventDefinition> {
                 performPostUpdateFuncs(ecModel, this._api);
             },
 
-            updateLayout: function (this: ECharts, payload: Payload): void {
+            updateLayout(this: ECharts, payload: Payload): void {
                 updateMethods.update.call(this, payload);
             }
         };
diff --git a/src/echarts.ts b/src/echarts.ts
index c457055..e998b0f 100644
--- a/src/echarts.ts
+++ b/src/echarts.ts
@@ -38,4 +38,4 @@ export default {
         // @ts-ignore
         return init.apply(null, arguments);
     }
-}
\ No newline at end of file
+};
\ No newline at end of file
diff --git a/test/resize-animation.html b/test/resize-animation.html
new file mode 100644
index 0000000..359a9cb
--- /dev/null
+++ b/test/resize-animation.html
@@ -0,0 +1,117 @@
+
+<!--
+Licensed to the Apache Software Foundation (ASF) under one
+or more contributor license agreements.  See the NOTICE file
+distributed with this work for additional information
+regarding copyright ownership.  The ASF licenses this file
+to you under the Apache License, Version 2.0 (the
+"License"); you may not use this file except in compliance
+with the License.  You may obtain a copy of the License at
+
+   http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing,
+software distributed under the License is distributed on an
+"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+KIND, either express or implied.  See the License for the
+specific language governing permissions and limitations
+under the License.
+-->
+
+<html>
+    <head>
+        <meta charset="utf-8">
+        <script src="lib/esl.js"></script>
+        <script src="lib/config.js"></script>
+        <script src="lib/testHelper.js"></script>
+        <link rel="stylesheet" href="lib/reset.css">
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+    </head>
+    <body>
+        <style>
+            body {
+                position: absolute;
+                left: 0;
+                top: 0;
+            }
+        </style>
+        <div id="main0"></div>
+
+        <script>
+
+
+            require([
+                'echarts'
+                // 'echarts/chart/pie',
+                // 'echarts/component/title',
+                // 'echarts/component/legend',
+                // 'echarts/component/tooltip'
+            ], function (echarts) {
+
+                require([
+                    'echarts'
+                ], function (echarts) {
+                    const option = {
+                        tooltip : {
+                            trigger: 'item',
+                            formatter: "{a} <br/>{b} : {c} ({d}%)"
+                        },
+                        legend: {
+                            orient: 'vertical',
+                            left: 'left',
+                            data: ['直接访问','邮件营销','联盟广告','视频广告(value is null)','搜索引擎']
+                        },
+                        series : [
+                            {
+                                name: '访问来源',
+                                type: 'pie',
+                                radius : '55%',
+                                center: ['50%', '60%'],
+                                selectedMode: 'single',
+                                data:[
+                                    {value:335, name:'直接访问'},
+                                    {value:310, name:'邮件营销'},
+                                    {value:234, name:'联盟广告'},
+                                    {value:null, name:'视频广告(value is null)'},
+                                    {value:1548, name:'搜索引擎'}
+                                ]
+                            }
+                        ]
+                    };
+
+                    var myChart = testHelper.create(echarts, 'main0', {
+                        width: 600,
+                        height: 400,
+                        title: [
+                            'Resize animation should be configured properly'
+                        ],
+                        option: option,
+                        buttons: [{
+                            text: 'Resize without animation by default',
+                            onClick: () => {
+                                myChart.resize({
+                                    width: 400,
+                                    height: 266
+                                })
+                            }
+                        }, {
+                            text: 'Resize with animaiton',
+                            onClick: () => {
+                                myChart.resize({
+                                    width: 300,
+                                    height: 200,
+                                    animation: {
+                                        // Use a long duration so it can be recorded
+                                        duration: 2000,
+                                        easing: 'cubicInOut'
+                                    }
+                                })
+                            }
+                        }]
+                    });
+                });
+
+            });
+        </script>
+    </body>
+</html>
\ No newline at end of file
diff --git a/test/runTest/actions/__meta__.json b/test/runTest/actions/__meta__.json
index acc5386..526b2fb 100644
--- a/test/runTest/actions/__meta__.json
+++ b/test/runTest/actions/__meta__.json
@@ -131,6 +131,7 @@
   "radar2": 1,
   "radar3": 1,
   "radar4": 1,
+  "resize-animation": 1,
   "sankey-depth": 1,
   "sankey-jump": 1,
   "sankey-level": 1,
diff --git a/test/runTest/actions/resize-animation.json b/test/runTest/actions/resize-animation.json
new file mode 100644
index 0000000..1e21cf9
--- /dev/null
+++ b/test/runTest/actions/resize-animation.json
@@ -0,0 +1 @@
+[{"name":"Action 1","ops":[{"type":"mousemove","time":294,"x":206,"y":78},{"type":"mousedown","time":382,"x":206,"y":78},{"type":"mouseup","time":481,"x":206,"y":78},{"time":482,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":910,"x":207,"y":78},{"type":"mousemove","time":1111,"x":248,"y":78},{"type":"mousedown","time":1201,"x":248,"y":78},{"type":"mouseup","time":1305,"x":248,"y":78},{"time":1306,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":1320,"x": [...]
\ 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