echarts柱状图柱条设置图片

要在echarts柱状图中设置柱条图片，可以使用echarts的bar.series.barWidth属性和bar.series.itemStyle.normal.color属性。具体步骤如下：

1.在option中设置barWidth属性，该属性用于设置柱条的宽度，可以是像素值或百分比。例如，设置柱条宽度为50%：

option = {
    ...
    series: [{
        type: 'bar',
        barWidth: '50%',
        ...
    }]
    ...
};

2.在itemStyle.normal.color属性中设置柱条的背景图片。该属性可以是一个图片的url或者是一个CanvasPattern对象。例如，设置柱条背景图片为一个红色的渐变：

option = {
    ...
    series: [{
        type: 'bar',
        barWidth: '50%',
        itemStyle: {
            normal: {
                color: new echarts.graphic.LinearGradient(
                    0, 0, 0, 1,
                    [
                        {offset: 0, color: 'red'},
                        {offset: 1, color: 'white'}
                    ]
                )
            }
        },
        ...
    }]
    ...
};

3.在itemStyle.normal.color属性中设置柱条的背景图片。该属性可以是一个图片的url或者是一个CanvasPattern对象。例如，设置柱条背景图片为一个红色的渐变：

option = {
    ...
    series: [{
        type: 'bar',
        barWidth: '50%',
        itemStyle: {
            normal: {
                color: new echarts.graphic.Pattern(
                    imageDom, // 图片对象
                    'repeat' // 图片平铺方式
                )
            }
        },
        ...
    }]
    ...
};

其中，imageDom是一个Image对象，可以通过new Image()创建，也可以通过document.createElement('img')创建。需要注意的是，图片必须在加载完成后才能使用，可以通过监听Image对象的load事件来确保图片已经加载完成。