页面树结构

版本比较

标识

  • 该行被添加。
  • 该行被删除。
  • 格式已经改变。

(本文档仅供参考)

问题

希望柱图显示为进度条的效果

解决方案

具体请参考如下扩展属性:

代码块
languagexml
linenumberstrue
{
    "series": [{
        "type": "bar",
        "barWidth": "12%",
        "itemStyle": {
            "normal": {
                "color": "red",
                "barBorderRadius": 20,
                "label": {
                    "show": true,
                    "textStyle": {
                        "color": "rgba(0,0,0,1)"
                    },
                    "position": ["150%", "-5%"]//如为横条柱图烦请将150%修改为100%
                }
            }
        }
    }, {
        "type": "bar",
        "barWidth": "18%",
        "barGap": "-124%",
        "silent": true,
        "itemStyle": {
            "normal": {
                "borderWidth": 0.8,
                "color": "transparent",
                "borderColor": "#49698f",
                "barBorderRadius": 50,
                "label": {
                    "show": false,
                    "textStyle": {
                        "color": "rgba(0,0,0,1)"
                    }
                }
            }
        }
    }]
}

...