v-charts 绘制的图片 下方空白部分过大，怎么裁剪

Question

如图上红色框图所示，如何裁去这部分高度?

HTML 部分代码如下所示

      <div class="left">
        <ve-histogram ref="histogram"
                      :legend="legend"
                      :x-axis="xAxis"
                      :y-axis="yAxis"
                      height='100%'
                      width='100%'
                      :series="series"></ve-histogram>
      </div>

CSS 部分代码如下所示

    .left {
      padding-top: 20px;
      height: 100%;
      width: 75%;
    }

Answer 1

使用gird设置即可，参照e-charts文档

        <ve-histogram ref="histogram"
                      height='100%'
                      width='100%'
                      :legend="legend"
                      :x-axis="xAxis"
                      :y-axis="yAxis"
                      :grid="grid"
                      :series="series"></ve-histogram>

      // 距离周围的距离
      grid: {
        top: 40,
        bottom: 10
      },