柱状图设置了柱子的形状后会导致柱子无法触发tooltip和点击事件 #2806

Closed
EyrebaLeo opened this Issue Mar 11, 2016 · 1 comment

Comments

Projects
None yet
2 participants
@EyrebaLeo

问题简述 (One-line summary)

当对柱子的形状参数barBorderRadius进行设置,传的是数组,并且第一个参数为零是,如[0,7,7,0],就会出现鼠标放在柱子上不能触发tooltip以及设置了单击双击事件之后点击无效的情况

版本及环境 (Version & Environment)

  • ECharts 版本 (3.1.3):
  • 浏览器类型和版本 (Chrome,版本 49.0.2623.87 m):
  • 操作系统类型和版本 (windows7 专业版):

重现步骤 (Steps to reproduce)

1.设置柱子的形状barBorderRadius为[0,7,7,0]
2.setOption就会发现柱子不能点击和触发tooltip;
3.但是参数设置为[7,0,0,0]就可以了

期望结果 (Expected behaviour)

不管如何修改柱子的形状都能够触发tooltip和点击事件

ECharts配置项 (ECharts option)

option = {
        "calculable": false,
        "color": ["#42ccef", "#9592f0", "#de90f4", "#5ed1b8", "#5592ee", "#b97d78", "#f194b3", "#f3ce03", "#a7e52d", "#90a7de"],
        "tooltip": {
            "trigger": "item"
        },
        "xAxis": [{
            "max": 13426.400000000001,
            "show": true,
            "splitLine": {
                "lineStyle": {
                    "type": "dashed"
                }
            },
            "axisLine": {
                "show": false
            },
            "axisLabel": {
                "show": false,
                "margin": 8,
                "textStyle": {
                    "fontSize": "12",
                    "fontFamily": "Microsoft Yahei",
                    "align": "left"
                }
            },
            "axisTick": {
                "show": false
            },
            "type": "value",
            "name": "",
            "scale": false
        }],
        "yAxis": [{
            "splitLine": {
                "show": true,
                "lineStyle": {
                    "type": "dashed"
                }
            },
            "axisLine": {
                "show": false
            },
            "axisLabel": {
                "margin": 5,
                "textStyle": {
                    "fontSize": "12",
                    "fontFamily": "Microsoft Yahei",
                    "color": "#666666",
                    "align": "right"
                }
            },
            "axisTick": {
                "show": false
            },
            "type": "category",
            "data": ["io", "mem", "cpu", "timeline"],
            "show": true,
            "name": "",
            "scale": false
        }],
        "series": [{
            "barMaxWidth": 14,
            "name": "GML",
            "type": "bar",
            "stack": "总量",
            "itemStyle": {
                "normal": {
                    "barBorderRadius": [0, 7, 7, 0]
                }
            },
            "data": [{
                "name": "io",
                "value": 9861
            }, {
                "name": "mem",
                "value": 12768
            }, {
                "name": "cpu",
                "value": 659
            }, {
                "name": "timeline",
                "value": 2016
            }],
            "label": {
                "normal": {
                    "show": true,
                    "position": "right",
                    "textStyle": {
                        "fontSize": "14",
                        "fontFamily": "Helvetica",
                        "fontStyle": "normal",
                        "color": "#333333",
                        "align": "left"
                    }
                },
                "emphasis": {
                    "show": true,
                    "position": "right",
                    "textStyle": {
                        "fontSize": "14",
                        "fontFamily": "Helvetica",
                        "fontStyle": "normal",
                        "color": "#333333",
                        "align": "left"
                    }
                }
            }
        }],
        "grid": {
            "left": 64,
            "top": 0,
            "right": 1,
            "bottom": 20,
            "borderWidth": 0,
            "bordcolor": "#e5e5e5"
        },
        "colorList": ["#42ccef", "#9592f0", "#de90f4", "#5ed1b8", "#5592ee", "#b97d78", "#f194b3", "#f3ce03", "#a7e52d", "#90a7de"],
        "title": {
            "show": true,
            "text": "",
            "subtext": ""
        },
        "dataZoom": [{
            "show": false
        }],
        "event": [],
        "theme": "agileUI",
        "chartType": {
            "timeline": "line",
            "cpu": "line",
            "mem": "line",
            "io": "line"
        },
        "animation": false
    }
@EyrebaLeo

This comment has been minimized.

Show comment
Hide comment
@EyrebaLeo

EyrebaLeo Mar 14, 2016

@pissang 准确的说是当柱子的宽度比较小时就会出现上述的情况

@pissang 准确的说是当柱子的宽度比较小时就会出现上述的情况

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment