You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by wa...@apache.org on 2021/03/05 01:31:15 UTC

[echarts] 01/01: fix(toolbox): the `show` option of customized toolbox button does not work, resolves #14405.

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

wangzx pushed a commit to branch fix-toolbox-custom
in repository https://gitbox.apache.org/repos/asf/echarts.git

commit 2d53ee6cb10943f016be3beaf712a04a45fd0825
Author: plainheart <yh...@all-my-life.cn>
AuthorDate: Fri Mar 5 09:15:25 2021 +0800

    fix(toolbox): the `show` option of customized toolbox button does not work, resolves #14405.
---
 src/component/toolbox/ToolboxView.ts | 24 ++++++----
 test/toolbox-custom.html             | 90 ++++++++++++++++++++++++++++++++++++
 2 files changed, 104 insertions(+), 10 deletions(-)

diff --git a/src/component/toolbox/ToolboxView.ts b/src/component/toolbox/ToolboxView.ts
index 8dd7881..5fb6f2a 100644
--- a/src/component/toolbox/ToolboxView.ts
+++ b/src/component/toolbox/ToolboxView.ts
@@ -126,17 +126,21 @@ class ToolboxView extends ComponentView {
             feature.ecModel = ecModel;
             feature.api = api;
 
-            if (feature instanceof ToolboxFeature) {
-                if (!featureName && oldName) {
-                    feature.dispose && feature.dispose(ecModel, api);
-                    return;
-                }
+            const isToolboxFeature = feature instanceof ToolboxFeature;
+            if (!featureName && oldName) {
+                isToolboxFeature
+                    && (feature as ToolboxFeature).dispose
+                    && (feature as ToolboxFeature).dispose(ecModel, api);
+                return;
+            }
 
-                if (!featureModel.get('show') || feature.unusable) {
-                    feature.remove && feature.remove(ecModel, api);
-                    return;
-                }
+            if (!featureModel.get('show') || (isToolboxFeature && (feature as ToolboxFeature).unusable)) {
+                isToolboxFeature
+                    && (feature as ToolboxFeature).remove
+                    && (feature as ToolboxFeature).remove(ecModel, api);
+                return;
             }
+
             createIconPaths(featureModel, feature, featureName);
 
             featureModel.setIconStatus = function (this: ToolboxFeatureModel, iconName: string, status: DisplayState) {
@@ -362,4 +366,4 @@ class ToolboxView extends ComponentView {
 function isUserFeatureName(featureName: string): boolean {
     return featureName.indexOf('my') === 0;
 }
-export default ToolboxView;
\ No newline at end of file
+export default ToolboxView;
diff --git a/test/toolbox-custom.html b/test/toolbox-custom.html
new file mode 100644
index 0000000..de6990f
--- /dev/null
+++ b/test/toolbox-custom.html
@@ -0,0 +1,90 @@
+<!DOCTYPE html>
+<!--
+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">
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <script src="lib/esl.js"></script>
+        <script src="lib/config.js"></script>
+        <script src="lib/facePrint.js"></script>
+        <script src="lib/testHelper.js"></script>
+        <!-- <script src="ut/lib/canteen.js"></script> -->
+        <link rel="stylesheet" href="lib/reset.css" />
+    </head>
+    <body>
+        <div id="main0"></div>
+
+        <script>
+        require(['echarts'], function (echarts) {
+            var option = {
+                xAxis: {},
+                yAxis: {},
+                series: {
+                    type: 'line',
+                    data: [[11, 22], [33, 44]]
+                },
+                toolbox: {
+                    show: true,
+                    right: 20,
+                    feature: {
+                        restore: {},
+                        saveAsImage: {},
+                        dataZoom: {},
+                        dataView: {
+                            show: false
+                        },
+                        myTool1: {
+                            show: false,
+                            title: 'myTool1',
+                            icon: 'path://M432.45,595.444c0,2.177-4.661,6.82-11.305,6.82c-6.475,0-11.306-4.567-11.306-6.82s4.852-6.812,11.306-6.812C427.841,588.632,432.452,593.191,432.45,595.444L432.45,595.444z M421.155,589.876c-3.009,0-5.448,2.495-5.448,5.572s2.439,5.572,5.448,5.572c3.01,0,5.449-2.495,5.449-5.572C426.604,592.371,424.165,589.876,421.155,589.876L421.155,589.876z M421.146,591.891c-1.916,0-3.47,1.589-3.47,3.549c0,1.959,1.554,3.548,3.47,3.548s3.469-1.589,3.469-3.548C424.614, [...]
+                            onclick: function (){
+                                alert('myToolHandler1')
+                            }
+                        },
+                        myTool2: {
+                            show: true,
+                            title: 'myTool2',
+                            icon: 'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7',
+                            onclick: function () {
+                                alert('myToolHandler2')
+                            }
+                        }
+                    }
+                },
+                animation: false
+            };
+
+            var chart = testHelper.create(echarts, 'main0', {
+                title: [
+                    'Customized toolbox button **should not be visible** when `show` is set to be `false`',
+                    'myTool1 should be **invisible**, myTool2 should be **visible**',
+                    'See https://github.com/apache/echarts/issues/14405'
+                ],
+                option: option
+            });
+        });
+        </script>
+
+
+    </body>
+</html>
+


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