option = {
toolbox: {
iconStyle: {
borderColor: 'red', // 图标边框颜色
borderWidth: 2, // 图标边框宽度
color: 'green', // 图标颜色
shadowBlur: 10, // 图标阴影模糊大小
shadowColor: 'rgba(0, 0, 0, 0.5)' // 图标阴影颜色
},
feature: {
saveAsImage: {
show: true,
title: '保存为图片'
},
dataZoom: {
show: true,
title: {
zoom: '区域缩放',
back: '区域缩放还原'
}
},
// 其他工具按钮配置...
}
},
// 其他配置...
};
// 初始化图表
var myChart = echarts.init(document.getElementById('yourChartId'));
myChart.setOption(option);
在上述代码中,我们使用了 iconStyle 属性来配置工具栏组件中所有按钮的图标样式。你可以根据需要调整边框颜色、宽度、图标颜色、阴影模糊大小和阴影颜色等参数。
请注意,这里的配置是应用于所有工具栏按钮的图标样式。如果你希望为某个特定按钮配置独特的图标样式,可以在对应的按钮配置中使用 iconStyle 属性:
// 在 feature 中单独为某个按钮配置图标样式
feature: {
myCustomTool: {
show: true,
title: '自定义工具',
icon: 'path/to/custom/icon.png',
iconStyle: {
color: 'blue',
// 其他样式配置...
},
onclick: function () {
// 点击事件处理...
}
},
// 其他工具按钮配置...
}
通过在特定按钮的配置中使用 iconStyle,你可以为该按钮设置独特的图标样式。
转载请注明出处:http://www.zyzy.cn/article/detail/5330/ECharts