使用 vue 调整图表大小

Question

我想知道如何为图表指定尺寸。

我使用 vue-chartjs，但没有看到任何选项。

我只是在图表组件中有这段代码

<script>
    import { Line, mixins } from 'vue-chartjs'
    const { reactiveProp } = mixins;

    export default {
        name: 'line_chart',
        extends: Line,
        mixins: [reactiveProp],
        props: ['options'],
        mounted () {
            this.renderChart(this.chartData, this.options);
        }
    }
</script>

以及渲染组件脚本中的这段代码

            fillData () {
                this.data_collection = {
                    labels: [0, 25, 50, 100],
                    datasets: [
                        {
                            label: 'Blue',
                            backgroundColor: '#147aff',
                            fill: false ,
                            borderColor: '#147aff',
                            data: [0, 50, 100, 0],
                        },
                    ]
                };
                this.chart_options = {
                    responsive: true,
                }
            },

Answer 1

通过以下方式：

<elemento :styles="myStyles"></elemento>
<script>
export default: {
computed: {
    myStyles () {
        return {height: '99px'}
    }
  }
}
</script>

示例： https://jsfiddle.net/hamiltongabriel/7s40paog/6/