switch special value

apache · Nov 21, 2019 · 0fc6c8d · 0fc6c8d
1 parent 89961d1
commit 0fc6c8d
Show file tree

Hide file tree

Showing 2 changed files with 94 additions and 2 deletions.
diff --git a/src/chart/bar/BarView.js b/src/chart/bar/BarView.js
@@ -425,7 +425,7 @@ function updateStyle(
 
     el.useStyle(zrUtil.defaults(
         {
-            stroke : layout.startAngle === layout.endAngle ? 'none' : stroke,
+            stroke: layout.startAngle === layout.endAngle ? 'none' : stroke,
             fill: layout.startAngle === layout.endAngle ? 'none' : color,
             opacity: opacity
         },
@@ -445,7 +445,9 @@ function updateStyle(
             seriesModel, dataIndex, labelPositionOutside
         );
     }
-
+    if (layout.startAngle === layout.endAngle) {
+        hoverStyle.fill = hoverStyle.stroke = 'none';
+    }
     graphic.setHoverStyle(el, hoverStyle);
 }
 

diff --git a/test/polar-rounded.html b/test/polar-rounded.html
@@ -44,6 +44,7 @@
 
         <div id="main4"></div>
 
+        <div id="main5"></div>
 
 
 
@@ -194,6 +195,11 @@
                     itemStyle: {
                         borderColor: 'red',
                         borderWidth: 1
+                    },emphasis:{
+                        itemStyle:{
+                            color:'red',
+                            borderColor:'blue'
+                        }
                     }
                 }],
                 legend: {
@@ -282,5 +288,89 @@
         });
         </script>
 
+
+        <script>
+        require(['echarts'], function (echarts) {
+            let hoverColors = [
+                '255,0,0',
+                '0,128,0',
+                '0,0,255',
+            ];
+            let hoverIndex = 0;
+
+            let getOptions = function(hoverIndex){
+                return  {
+                    angleAxis: {
+                        max: 5
+                    },
+                    radiusAxis: {
+                        type: 'category',
+                        data: ['a'],
+                        z: 10
+                    },
+                    polar: {
+                        radius: ['20%', '60%']
+                    },
+                    series: [{
+                        type: 'bar',
+                        data: [4],
+                        coordinateSystem: 'polar',
+                        name: 'A',
+                        roundCap: true,
+                        animationDuration:5 * 1000,
+                        color: `rgba(${hoverColors[hoverIndex]},0.5)`,
+                        itemStyle: {
+                            borderColor: `rgb(${hoverColors[hoverIndex]})`,
+                            borderWidth: 0
+                        }, 
+                        emphasis: {
+                            itemStyle: {
+                                color: `rgb(${hoverColors[hoverIndex]})`,
+                                borderColor: `rgb(${hoverColors[hoverIndex]})`
+                            }
+                        }
+                    }],
+                    legend: {
+                        show: true,
+                        data: ['A']
+                    },
+                    tooltip: {
+                        show: true
+                    }
+                };
+            }
+
+            var chart = testHelper.create(echarts, 'main5', {
+                title: [
+                    'Polar radius and value [0,\'-\',\'rational num\'] test',
+                    'Click button to change hoverStyle and data value',
+                ],
+                option: getOptions(hoverIndex),
+                buttons: [{
+                    text: 'Change data',
+                    onclick: function () {
+                        ++hoverIndex > 2 && (hoverIndex=0)
+                        let option = chart.getOption();
+
+                        if (option.series[0].data[0] == 0) {
+                            option.series[0].data[0] = 4;
+                        } else if (option.series[0].data[0] == 4) {
+                            option.series[0].data[0] = '-';
+                        } else if (option.series[0].data[0] = '-') {
+                            option.series[0].data[0] = 0;
+                        }
+
+                        option.series[0].color = `rgba(${hoverColors[hoverIndex]},0.5)`;
+                        option.series[0].emphasis.itemStyle = {
+                            color:`rgb(${hoverColors[hoverIndex]})`,
+                            borderColor:`rgb(${hoverColors[hoverIndex]})`
+                        };
+                        chart.setOption(option);
+                    }
+                }]
+            });
+        });
+        </script>
+
     </body>
 </html>