data_view/docs/guide/capsuleChart.md

---

sidebarDepth: 2

胶囊柱图

<dv-capsule-chart :config="config" style="width:300px;height:200px" />

基本示例

<<< @/docs/guide/codeData/capsuleChart/demo1.js

单位显示

<<< @/docs/guide/codeData/capsuleChart/demo2.js

更换颜色

<<< @/docs/guide/codeData/capsuleChart/demo3.js

config属性

属性|说明|类型|可选值|默认值 :--:|:--:|:--:|:--:|:--: data|柱数据|Array<Object>|data属性|[] unit|单位|String|---|'' colors|环颜色|Array<String>|[1]|[2]

config注释

[1] 颜色支持hex|rgb|rgba|颜色关键字等四种类型。

[2] 默认配色为['#37a2da', '#32c5e9', '#67e0e3', '#9fe6b8', '#ffdb5c', '#ff9f7f', '#fb7293']。

data属性

属性|说明|类型|可选值|默认值 :--:|:--:|:--:|:--:|:--: name|柱名称|String|---|--- value|柱对应值|Number|---|---