本文共 1849 字，大约阅读时间需要 6 分钟。

修改grid属性：

var option = {
       title: {
           // text: '分层电量环比'        // subtext: '纯属虚构'    },    tooltip: {
           trigger: 'axis'    },    grid: {
         bottom: '20px'    },    legend: {
           data: ['上日电量', '当日电量']    },    toolbox: {
           show: true,        feature: {
               // dataView: { show: true, readOnly: false },            magicType: {
    show: true, type: ['line', 'bar'] },            restore: {
    show: true },            saveAsImage: {
    show: true }        }    },    calculable: true,    xAxis: [        {
               type: 'category',            data: xAxis        }    ],    yAxis: [        {
               type: 'value'        }    ],    series: [        {
               name: '上日电量',            type: 'bar',            data: yesterdayElec,            itemStyle: {
    color: '#3AA1FF' },            markPoint: {
                   data: [                    {
    type: 'max', name: '最大值' },                    {
    type: 'min', name: '最小值' }                ]            },            markLine: {
                   data: [                    {
    type: 'average', name: '平均值' }                ]            }        },        {
               name: '当日电量',            type: 'bar',            data: DayElec,            itemStyle: {
    color: '#4ECB73' },            markPoint: {
                   data: [                    {
    name: '年最高', type: 'max', xAxis: 7, yAxis: 183 },                    {
    name: '年最低', type: 'min', xAxis: 11, yAxis: 3 }                ]            },            markLine: {
                   data: [                    {
    type: 'average', name: '平均值' }                ]            }        }    ]}

• grid属性中包含：top: ‘10px’, bottom: ‘15px’, right: ‘40%’，可直接设置px也可以设置成百分比形式，随着canvas的变化自动变化大小。
• 本例中的bottom设置的为20px，这个值根据自己图形大小设置的。值小：X轴被遮挡；值大：图下方间距加大。

转载地址：http://dhlbi.baihongyu.com/