Fix#11236 merging newOption from MagicType to display titles for different stack state

e1bd8059 · alex2wong · e7af6731 · e1bd8059 · e1bd8059 · e1bd8059
3 changed file
--- a/src/component/toolbox/ToolboxView.js
+++ b/src/component/toolbox/ToolboxView.js
@@ -63,6 +63,11 @@ export default echarts.extendComponentView({
            var featureModel = new Model(featureOpt, toolboxModel, toolboxModel.ecModel);
            var feature;

+            // FIX#11236, merge feature title from MagicType newOption. TODO: consider seriesIndex ?
+            if (payload && payload.newOption !== undefined && payload.newOption.series.length > 0) {
+                featureOpt.title = payload.newOption.series[0].title;
+            }
+
            if (featureName && !oldName) { // Create
                if (isUserFeatureName(featureName)) {
                    feature = {

--- a/src/component/toolbox/feature/MagicType.js
+++ b/src/component/toolbox/feature/MagicType.js
@@ -103,7 +103,7 @@ var seriesOptGenreator = {
        if (seriesType === 'line' || seriesType === 'bar') {
            return zrUtil.merge({
                id: seriesId,
-                stack: seriesModel.get('stack') === '__ec_magicType_stack__' ? '' : '__ec_magicType_stack__'
+                stack: ''
            }, model.get('option.tiled') || {}, true);
        }
    }

--- a/test/toolbox-stack.html
+++ b/test/toolbox-stack.html
@@ -29,18 +29,27 @@ under the License.
 <body>
    <style>
        html,
-        body,
-        #main {
-            width: 80%;
+        body {
+            width: 100%;
            height: 100%;
            margin: 0;
        }

        #main {
+            width: 90%;
+            height: 45%;
+            margin: 0;
+            background: #fff;
+        }
+        #nodata {
+            width: 90%;
+            height: 45%;
+            margin: 0;
            background: #fff;
        }
    </style>
    <div id="main"></div>
+    <div id="nodata"></div>
    <script>

        require([
@@ -64,6 +73,7 @@ under the License.
                },
                toolbox: {
                    show: true,
+                    right: '5%',
                    feature: {
                        saveAsImage: {
                            show: true,
@@ -115,6 +125,70 @@ under the License.

        });
    </script>
+    <script>
+
+        require([
+            'echarts'
+            // 'echarts/chart/bar',
+            // 'echarts/component/polar',
+            // 'zrender/vml/vml'
+        ], function (echarts) {
+
+            var chart = echarts.init(document.getElementById('nodata'), null, {
+                // renderer: 'svg'
+            });
+            option = {
+                color: ['#3398DB', '#CA2121'],
+                legend: {
+                    show: true,
+                    data: [],
+                },
+                tooltip: {
+                    show: true
+                },
+                toolbox: {
+                    show: true,
+                    right: '5%',
+                    feature: {
+                        saveAsImage: {
+                            show: true,
+                            title: 'Save As Image'
+                        },
+                        dataView: {
+                            show: true,
+                            title: 'Data View'
+                        },
+                        magicType : {show: true, type: ['line', 'bar', 'stack']},
+                    },
+                },
+                grid: {
+                    left: '3%',
+                    right: '4%',
+                    bottom: '3%',
+                    containLabel: true
+                },
+                xAxis : [
+                    {
+                        type : 'category',
+                        data : ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+                        axisTick: {
+                            alignWithLabel: true
+                        }
+                    }
+                ],
+                yAxis : [
+                    {
+                        type : 'value'
+                    }
+                ],
+                series : [
+                ]
+            };
+
+            chart.setOption(option, true);
+
+        });
+    </script>
 </body>

 </html>
\ No newline at end of file