apache
[Feature] displaying overlapped labels on emphasis even when hideOverlap is true
Version
5.3.3
Link to Minimal Reproduction
No response
Steps to Reproduce
版本：5.3.3
配置代码代码如下：
option = { "backgroundColor": "#000a40", "title": { "text": "title", "x": "center", "top": 15, "textStyle": { "color": "#fff" } }, "tooltip": { "trigger": "axis", "axisPointer": { "type": "shadow" } }, "emphasis": { "focus": "series", "label": { "show": true } }, "toolbox": { "feature": { "saveAsImage": { "backgroundColor": "#243a55" } }, "iconStyle": { "borderColor": "#fff", "fontSize": "22px" } }, "color": [ "#F56679", "#4C98FB", "#8CDF6C", "#9D50E0", "#1D50E0", "yellow", "purple", "white" ], "legend": { "bottom": 10, "left": "center", "itemWidth": 10, "itemHeight": 10, "padding": [ 5, 10 ], "textStyle": { "fontSize": 16, "color": "#96A4F4", "padding": [ 3, 0, 0, 0 ] }, "data": [ "公路", "水运", "民航", "铁路", "测试", "公路1", "水运1", "民航1", "铁路1", "测试1" ] }, "grid": { "left": "3%", "right": "4%", "bottom": "7%", "containLabel": true }, "xAxis": { "type": "category", "axisLabel": { "color": "#96A4F4", "rotate": 0 }, "axisLine": { "lineStyle": { "color": "#96A4F4" }, "width": 5 }, "axisTick": { "show": false }, "data": [ "2015", "2016", "2017", "2018" ] }, "yAxis": { "name": "单位：个", "type": "value", "axisLabel": { "color": "#96A4F4" }, "axisLine": { "lineStyle": { "color": "#96A4F4" }, "width": 5 }, "axisTick": { "show": false }, "splitLine": { "lineStyle": { "color": "rgba(150, 164, 244, 0.3)" } } }, "series": [ { "name": "公路", "type": "bar", "stack": "总数", "barWidth": "45%", "data": [ 1550, 1.26, 2125, 1800 ], "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } }, { "name": "水运", "type": "bar", "stack": "总数", "barWidth": "45%", "data": [ 929, 945, 1012, 9.3 ], "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } }, { "name": "民航", "type": "bar", "stack": "总数", "barWidth": "45%", "data": [ 2310, 2890, 3198, 3645 ], "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } }, { "name": "铁路", "type": "bar", "stack": "总数", "barWidth": "45%", "data": [ 1670, 2337, 2724, 2990 ], "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } }, { "name": "测试", "type": "bar", "stack": "总数", "barWidth": "45%", "data": [ 1550, 1.26, 2125, 1800 ], "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } }, { "name": "公路1", "type": "bar", "stack": "总数", "barWidth": "45%", "data": [ 929, 0.945, 1012, 9.3 ], "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } }, { "name": "水运1", "type": "bar", "stack": "总数", "barWidth": "45%", "data": [ 2310, 2890, 3198, 3645 ], "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } }, { "name": "民航1", "type": "bar", "stack": "总数", "barWidth": "45%", "data": [ 1670, 2337, 2724, 2990 ], "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } }, { "name": "铁路1", "type": "bar", "stack": "总数", "barWidth": "45%", "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } }, { "name": "测试1", "type": "bar", "stack": "总数", "barWidth": "45%", "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } } ] }
悬停截图效果如下：
期望效果：希望被隐藏掉的label“0.945”，在鼠标悬停的时候（即emphasis时）能显示出来。
Current Behavior
Expected Behavior
希望被隐藏掉的label“0.945”，在鼠标悬停的时候（即emphasis时）能显示出来。
Environment
- OS:
- Browser:
- Framework:
Any additional comments?
No response
@pineappleok It seems you are not using English, I've helped translate the content automatically. To make your issue understood by more people and get helped, we'd like to suggest using English next time. 🤗
TRANSLATED
TITLE
[Bug] labelLayout: label hidden by hideOverlap should be displayed during emphasis
BODY
Version
5.3.3
Link to Minimal Reproduction
No response
Steps to Reproduce
Version: 5.3.3
The configuration code code is as follows:
option = { "backgroundColor": "#000a40", "title": { "text": "title", "x": "center", "top": 15, "textStyle": { "color": " #fff" } }, "tooltip": { "trigger": "axis", "axisPointer": { "type": "shadow" } }, "emphasis": { "focus": "series", "label" : { "show": true } }, "toolbox": { "feature": { "saveAsImage": { "backgroundColor": "#243a55" } }, "iconStyle": { "borderColor": "#fff", "fontSize": "22px" } }, "color": [ "#F56679", "#4C98FB", "#8CDF6C", "#9D50E0", "#1D50E0", "yellow", "purple", "white " ], "legend": { "bottom": 10, "left": "center", "itemWidth": 10, "itemHeight": 10, "padding": [ 5, 10 ], "textStyle": { " fontSize": 16, "color": "#96A4F4", "padding": [ 3, 0, 0, 0 ] }, "data": [ "road", "water transport", "civil aviation", "railway", "test", "road 1", "water transport 1", "civil aviation 1", "railway 1", "test 1" ] }, "grid": { "left": "3%", "right": " 4%", "bottom": "7%", "containLabel": true }, "xAxis": { "type": "category", "axisLabel": { "color": "#96A4F4", "rotate" : 0 }, "axisLine": { "lineStyle": { "color": "#96A4F4" }, "width": 5 }, "axisTick": { "show": false }, "data": [ "2015", "2016", "2017", "2018" ] }, "yAxis": { "name": "Unit: Units", "type": " value", "axisLabel": { "color": "#96A4F4" }, "axisLine": { "lineStyle": { "color": "#96A4F4" }, "width": 5 }, "axisTick": { "show": false }, "splitLine": { "lineStyle": { "color": "rgba(150, 164, 244, 0.3)" } } }, "series": [ { "name": "Highway" , "type": "bar", "stack": "total", "barWidth": "45%", "data": [ 1550, 1.26, 2125, 1800 ], "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255 , 255, 255, 1)" }, "labelLine": { "show": true } }, { "name": "Water Transport", "type": "bar", "stack": "Total", "barWidth ": "45%", "data": [ 929, 945, 1012, 9.3 ], "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } }, { "name": "Civil Aviation", "type": "bar", "stack": "Total", "barWidth": "45%", " data": [ 2310, 2890, 3198, 3645 ], "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60 %", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } }, { "name" : "rail", "type": "bar", "stack": "total", "barWidth": "45%", "data": [ 1670, 2337, 2724, 2990 ], "labelLayout": { " hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } }, { "name": "test", "type": "bar", "stack": "total ", "barWidth": "45%", "data": [ 1550, 1.26, 2125, 1800 ], "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow ": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } }, { "name": "Highway 1", "type": "bar", "stack": "Total", "barWidth": "45%", "data": [ 929, 0.945, 1012, 9.3 ], "labelLayout": { "hideOverlap": true }, "label" : { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } }, { "name": "Water Transport 1", "type": "bar", "stack": "Total", "barWidth": "45 %", "data": [ 2310, 2890, 3198, 3645 ], "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } }, { "name": "Civil Aviation 1", "type": "bar", "stack": "Total", "barWidth": "45%", "data": [ 1670, 2337, 2724, 2990 ], " labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14 , "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } }, { "name": "Railway 1", "type": "bar", "stack": "Total", "barWidth": "45%", "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ], "fontSize": 14, "color": "rgba(255, 255, 25 5, 1)" }, "labelLine": { "show": true } }, { "name": "Test 1", "type": "bar", "stack": "Total", "barWidth": "45%", "labelLayout": { "hideOverlap": true }, "label": { "show": true, "labelNameShow": true, "position": [ "-60%", "50%" ] , "fontSize": 14, "color": "rgba(255, 255, 255, 1)" }, "labelLine": { "show": true } } ] }
The hover screenshot effect is as follows:
Expected effect: I hope that the hidden label "0.945" can be displayed when the mouse is hovered (ie, emphasis).
Current Behavior
Expected Behavior
It is hoped that the hidden label "0.945" can be displayed when the mouse is hovered (ie, emphasis).
Environment
- OS:
- Browser:
- Framework:
Any additional comments?
No response
![echarts-bot[bot] avatar](https://avatars.githubusercontent.com/in/20872?v=4 "Published by a pub.dev verified publisher"){kind=small}