setOptiontoolbox

工具栏。默认不显示。打开后占容器位置，默认贴绘图区右上，距绘图区是标准间距。

调用

chart.setOption({
    toolbox: {
        show: true
    }
})

left / center / right 相对绘图区。show: false 时仍可用 dispatchAction({ type: 'saveAsImage' }) 下载。

字段

字段	说明	类型	可选值	默认
show	是否显示	boolean	true / false	false
direction	按钮排列	string	horizontal / vertical	horizontal
x	水平位置。关键字相对绘图区	string / number	left / center / right	right
y	垂直位置。关键字相对绘图区	string / number	top / bottom / center	top
padding	内边距。数字或 [上, 右, 下, 左]。百分比相对容器。贴绘图区时，下边距会把按钮再往上推	number / string / array	—	4
backgroundColor	工具栏背景	string	—	transparent
borderWidth	边框线宽。为 0 不画	number	—	0
borderColor	边框颜色	string	—	#d1d5db
borderStyle	边框样式	string	solid / dashed	solid
radius	圆角，像素	number	—	0
itemGap	按钮间距，像素	number	—	8
itemStyle	按钮样式	object	—	见下表
feature.download	下载当前图	boolean / object	—	打开工具栏后默认提供

itemStyle

字段	说明	类型	可选值	默认
width	按钮宽	number / string	数字或 auto	16
height	按钮高	number / string	数字或 auto	16
background	按钮背景	string	—	transparent
color	图标颜色	string	—	#6b7280
hoverBg	悬停背景	string	—	rgba(0, 0, 0, 0.06)
hoverColor	悬停颜色	string	—	#111827
padding	按钮内边距	number / string / array	—	4
radius	按钮圆角，像素	number	—	4

download

下载含主图、图例、标题和轴文字。工具栏按钮本身不进图片。

字段	说明	类型	可选值	默认
show	是否显示下载按钮	boolean	true / false	true
type	图片格式	string	png / jpeg	png
name	文件名，不含扩展名。不写则用主标题	string	—	title.text 或 chart
title	按钮提示	string	—	下载
icon	自定义图标。可写 SVG 片段或按钮文字	string	—	内置

toolbox: {
    show: true,
    feature: {
        download: { type: 'png', name: '距离修正后的回波信号(532)' },
    },
}

show 为 false 时仍可下载：

chart.dispatchAction({ type: 'saveAsImage' })
chart.getDataURL({ layers: [myTitleEl] })

要把页面上的节点一起打进图，传入 layers。节点要能相对图表容器定位，超出容器的部分会被裁切。

在线示例

在线体验见 示例 · 工具栏配置。自己画工具栏见 自定义工具栏。