{{ target: series-bar }}

series.bar(Object)

柱状图

柱状图（或称条形图）是一种通过柱形的高度（横向的情况下则是宽度）来表现数据大小的一种常用图表类型。

type(string) = ‘bar’

{{ use: partial-component-id( prefix = “#” ) }}

{{ use: partial-series-name() }}

{{ use: partial-legend-hover-link() }}

{{ use: partial-coord-sys( seriesType = “bar”, coordSysDefault = “‘cartesian2d’”, cartesian2d = true, polar = true, geo = false ) }}

roundCap(boolean) = false

{{ use: partial-version( version = “4.5.0” ) }}

是否在环形柱条两侧使用圆弧效果。

仅对极坐标系柱状图有效。

~800x500

showBackground(boolean) = false

{{ use: partial-version( version = “4.7.0” ) }}

是否显示柱条的背景色。通过 backgroundStyle 配置背景样式。

~800x400

backgroundStyle(Object)

{{ use: partial-version( version = “4.7.0” ) }}

每一个柱条的背景样式。需要将 showBackground 设置为 true 时才有效。

~800x400

{{ use: partial-bar-item-style( prefix = “##”, useColorPalatte = false, hasCallback = true, defaultColor = “‘rgba(180, 180, 180, 0.2)’” ) }}

{{ use: partial-bar-state( prefix = “#”, topLevel = true, isNormal = true ) }}

labelLayout(Object|Function)

{{ use: partial-label-layout( prefix = “##” ) }}

emphasis(Object)

高亮的图形样式和标签样式。

{{ use: partial-focus-blur-scope() }}

{{ use: partial-bar-state( prefix = “##”, topLevel = true, isNormal = false ) }}

blur(Object)

淡出时的图形样式和标签样式。开启 emphasis.focus 后有效。

{{ use: partial-bar-state( prefix = “##”, topLevel = true, isNormal = false ) }}

select(Object)

数据选中时的图形样式和标签样式。开启 selectedMode 后有效。

{{ use: partial-bar-state( prefix = “##”, topLevel = true, isNormal = false ) }}

{{ use: partial-selected-mode( version = ‘5.0.0’ ) }}

stack(string) = null

数据堆叠，同个类目轴上系列配置相同的stack值可以堆叠放置。

sampling(string)

柱状图在数据量远大于像素点时候的降采样策略，开启后可以有效的优化图表的绘制效率，默认关闭，也就是全部绘制不过滤数据点。

可选：

  • 'lttb' 采用 Largest-Triangle-Three-Bucket 算法，可以最大程度保证采样后线条的趋势，形状和极值。
  • 'average' 取过滤点的平均值
  • 'max' 取过滤点的最大值
  • 'min' 取过滤点的最小值
  • 'sum' 取过滤点的和

{{ use: partial-cursor() }}

{{ use: partial-barGrid( seriesType = ‘bar’ ) }}

{{ use: partial-large( prefix = “#”, defaultLargeThreshold = 400 ) }}

{{ use: partial-progressive( prefix = ‘#’, supportProgressiveChunkMode = true, defaultProgressive = 5000, defaultProgressiveChunkMode = ‘mod’ ) }}

{{ use: partial-series-dimensions( prefix = “#” ) }}

{{ use: partial-series-encode( prefix = “#” ) }}

{{ use: partial-seriesLayoutBy() }}

{{ use: partial-datasetIndex() }}

{{ use: partial-series-group-id() }}

data(Array)

{{ use: partial-2d-data-desc() }}

name(string)

数据项名称。

value(number)

单个数据项的数值。

{{ use: partial-data-group-id( prefix = ‘##’ ) }}

{{ use: partial-bar-state( prefix = “##”, topLevel = false, isNormal = true ) }}

emphasis(Object)

单个数据的高亮状态配置。

{{ use: partial-bar-state( prefix = “###”, topLevel = false, isNormal = false ) }}

blur(Object)

{{ use: partial-version( version = “5.0.0” ) }}

单个数据的淡出状态配置。

{{ use: partial-bar-state( prefix = “###”, topLevel = false, isNormal = false ) }}

select(Object)

{{ use: partial-version( version = “5.0.0” ) }}

单个数据的选中状态配置。

{{ use: partial-bar-state( prefix = “###”, topLevel = false, isNormal = false ) }}

{{ use: partial-clip( prefix = “#” ) }}

{{ use: partial-z-zlevel( prefix = “#”, componentName = “柱状图” ) }}

{{ use: partial-silent( prefix = “#” ) }}

{{ use: partial-animation( prefix = “#” ) }}

{{ use: partial-universal-transition( prefix = “#” ) }}

{{ use: partial-tooltip-in-series() }}

{{ target: partial-bar-state }}

#${prefix} label(Object)

{{ if: ${topLevel} }} {{ use: partial-label-desc() }} {{ else }} 单个数据的文本配置。 {{ /if }}

{{ use: partial-label( prefix = “#” + ${prefix}, defaultPosition = “‘inside’”, formatter = ${topLevel} ) }}

{{ if: ${topLevel && isNormal} }} ##${prefix} valueAnimation(boolean)

是否开启标签的数字动画。

参考这个 示例。 {{/if}}

#${prefix} labelLine(Object)

{{ use: partial-label-line-desc() }}

{{ use: partial-label-line( prefix = ‘#’ + ${prefix}, length2 = ${isNormal}, minTurnAngle = ${isNormal}, showAbove = ${isNormal}, smooth = ${isNormal} ) }}

#${prefix} itemStyle(Object)

{{ if: ${topLevel} }} {{ use: partial-item-style-desc() }} {{ else }} 单个数据的图形样式设置。 {{ /if }}

{{ use: partial-bar-item-style( prefix = “#” + ${prefix}, useColorPalatte = ${topLevel && isNormal}, useDecal = ${isNormal}, hasCallback = ${topLevel && isNormal} ) }}

{{ target: partial-bar-item-style }}

#${prefix} color(Color) = ${defaultColor|default(‘自适应’)}

柱条的颜色。{{ if: ${useColorPalatte} }} 默认从全局调色盘 option.color 获取颜色 {{ /if }}

#${prefix} borderColor(Color) = ‘#000’

柱条的描边颜色。

#${prefix} borderWidth(number) = 0

柱条的描边宽度，默认不描边。

#${prefix} borderType(string) = ‘solid’

柱条的描边类型，默认为实线，支持 'dashed', 'dotted'。

{{ use: partial-border-radius( prefix = ${prefix} ) }}

{{ use: partial-style-shadow-opacity( prefix = ${prefix} ) }}

{{ if: ${useDecal} }}

#${prefix} decal(Object)

{{ use: partial-decal-desc() }}

{{ use: partial-decal( prefix = ‘#’ + ${prefix} ) }}

{{ /if }}