1. 程式人生 > >【echarts】柱狀圖設定固定寬度(最大寬度)

【echarts】柱狀圖設定固定寬度(最大寬度)

    //柱狀圖
    var barGragh = document.getElementById('barGragh');
    var barChart = echarts.init(barGragh);
    var barChartoption = {
        tooltip: {
            trigger: 'axis'
        },
        legend: {
            data: ['上週同比', '今日整點'],
            /* y : 'bottom' */
        },
        toolbox: {
            show: false
, feature: { mark: {show: true}, dataView: {show: true, readOnly: false}, magicType: {show: true, type: ['line', 'bar']}, restore: {show: true}, saveAsImage: {show: true} } }, color : ['#ff7f50'
,'#87cefa', '#61a0a8', '#d48265', '#91c7ae','#749f83', '#ca8622', '#bda29a','#6e7074', '#546570', '#c4ccd3'], calculable: false, grid: { left: '0%', right: '0%', bottom: '5%', containLabel: true }, xAxis: [ { type
: 'category', data: [] } ], yAxis: [ { type: 'value', name: 'GMV' } ], series: [ { name: '上週同比', type: 'bar', barMaxWidth: '100', data: [], markPoint: { data: [ {type: 'max', name: '最大值'}, {type: 'min', name: '最小值'} ] }, markLine: { data: [ {type: 'average', name: '平均值'} ] } }, { name: '今日整點', type: 'bar', barMaxWidth: '100', data: [], markPoint: { data: [ {type: 'max', name: '最大值'}, {type: 'min', name: '最小值'} ] }, markLine: { data: [ {type: 'average', name: '平均值'} ] } } ] }; barChart.setOption(barChartoption);

關鍵程式碼:

barMaxWidth: '100',

實現效果

這裡寫圖片描述