Javascript 我想调整图表位置

问题是饼图位于卡片的左侧。 我使用Vue.js和ChartList制作饼图。 当我使用侧面板。然后它看起来是对齐的。 但是当这个页面出现时。卡片的左边有图表

我用的是这样的图表卡

<base-material-chart-card
      class="ma-0"
      :data="deviceMonitoringChart.data"
      :options="deviceMonitoringChart.options"
      :responsive-options="deviceMonitoringChart.responsiveOptions"
      color="success"
      hover-reveal
      type="Pie"
    >
      <template v-slot:reveal-actions>
        <v-tooltip bottom>
          <template v-slot:activator="{ attrs, on }">
            <v-btn
              v-bind="attrs"
              color="info"
              v-on="on"
            >
              <v-icon
                color="info"
              >
                mdi-refresh
              </v-icon>
            </v-btn>
          </template>

          <span>Refresh</span>
        </v-tooltip>

        <v-tooltip bottom>
          <template v-slot:activator="{ attrs, on }">
            <v-btn
              v-bind="attrs"
              light
              icon
              v-on="on"
            >
              <v-icon>mdi-pencil</v-icon>
            </v-btn>
          </template>

          <span>Change Date</span>
        </v-tooltip>
      </template>

      <h4 class="card-title font-weight-light">
        장비 모니터링
      </h4>

      <p class="d-inline-flex font-weight-light">
        전체 10개 중 1개 고장
      </p>
    </base-material-chart-card>
  </v-col>
  <v-col
    cols="12"
    md="6"
  >
    <base-material-card
      color="warning"
      class="px-5 py-3 ma-0 pa-0"
    >
      <template
        v-slot:heading
        class="pb-3 mb-3"
      >
        <div class="display-2 font-weight-light">
         
        </div>
      </template>
      <v-card-text>
        <v-data-table
          hide-default-header
          dense
          :headers="headers"
          :items="items"
        />
      </v-card-text>
    </base-material-card>
  </v-col>

mdi刷新
刷新
mdi铅笔
变更日期
장비 모니터링

전체 10개 중 1.개 고장

图表卡组件：我在上面的代码中使用了这个图表卡。我尝试了align=“center”，但对图表无效

<template>
  <base-material-card
    class="v-card--material-chart"
    v-bind="$attrs"
    v-on="$listeners"
  >
    <template
      v-slot:heading
      align="center"
    >
      <chartist
        :data="data"
        :event-handlers="eventHandlers"
        :options="options"
        :ratio="ratio"
        :responsive-options="responsiveOptions"
        :type="type"
        style="max-height: 150px;"
      />
    </template>

    <slot
      slot="reveal-actions"
      name="reveal-actions"
    />

    <slot />

    <slot
      slot="actions"
      name="actions"
    />
  </base-material-card>
</template>

<script>
  export default {
    name: 'MaterialChartCard',

    inheritAttrs: false,

    props: {
      data: {
        type: Object,
        default: () => ({}),
      },
      eventHandlers: {
        type: Array,
        default: () => ([]),
      },
      options: {
        type: Object,
        default: () => ({}),
      },
      ratio: {
        type: String,
        default: undefined,
      },
      responsiveOptions: {
        type: Array,
        default: () => ([]),
      },
      type: {
        type: String,
        required: true,
        validator: v => ['Bar', 'Line', 'Pie'].includes(v),
      },
    },
  }
</script>

<style lang="sass">
  .v-card--material-chart
      color: #999
      .v-card--material__heading
        max-height: 185px
        height: 185px
      .ct-label
        color: inherit
        opacity: .7
        font-size: 0.975rem
        font-weight: 100

      .ct-grid
        stroke: rgba(255, 255, 255, 0.2)

      .ct-series-a .ct-point,
      .ct-series-a .ct-line,
      .ct-series-a .ct-bar,
      .ct-series-a .ct-slice-donut
          stroke: rgba(255,255,255,.8)
      .ct-series-a .ct-area
          fill: rgba(255,255,255,.4)
</style>

导出默认值{
名称：“MaterialChartCard”，
继承属性：false，
道具：{
数据：{
类型：对象，
默认值：（）=>（{}），
},
事件处理程序：{
类型：数组，
默认值：（）=>（[]），
},
选项：{
类型：对象，
默认值：（）=>（{}），
},
比率：{
类型：字符串，
默认值：未定义，
},
响应选项：{
类型：数组，
默认值：（）=>（[]），
},
类型：{
类型：字符串，
要求：正确，
验证程序：v=>['Bar'、'Line'、'Pie']。包括（v），
},
},
}
.v-卡-材料表
颜色：#999
.v-卡片-物料标题
最大高度：185像素
高度：185像素
.ct标签
颜色：继承
不透明度：.7
字体大小：0.975rem
字号：100
.ct网格
笔划：rgba（255，255，255，0.2）
.ct-series-a.ct点，
.ct-series-a.ct生产线，
.ct-series-a.ct棒，
.ct-series-a.ct切片甜甜圈
笔划：rgba（255255.8）
.ct-系列-a.ct区域
填充：rgba（255255.4）