如何在GChart中自定义Vue.js？

Question

晚上好。我正在学习Vue.js，我想做一个基本的图表网站，以实践和建立技能。我正在尝试定制我的GChart。当前图表：1。我要做的第一件事是定制背景颜色。接下来我要做的是去掉旁边的标签，最后，虽然图表上面写着“你”，但这不是图表的名字。这是我的密码：

​

import { GChart } from "vue-google-charts";
export default {
  name: 'HelloWorld',
  components: {
    GChart
  },
  computed: {
    myStyles () {
      return {
        position: 'relative',
      }
    }
  },
  data () {
    return {
      chartData: [
        ['You', 'Percent'],
        ['Cute',     100],
      ],
      chartOptions: {
        chart: {
          title: 'Company Performance',
          subtitle: 'Sales, Expenses, and Profit: 2014-2017',
        }
      }
    }
  }
}

#chart{
  padding:5px;
  width:60%;
  margin:auto;
  background-color:rgb(241, 241, 129);
}
#actualChart{
  margin:auto;
  height:300px;
  width:230px;
  background-color:rgb(241, 241, 129);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.15/vue.js"></script>
<div id="chart">
    <h1>You</h1>
    <div id="actualChart">
    <GChart
    type="PieChart"
    :data="chartData"
    :options="chartOptions"
    :styles="myStyles"
  /> 
  </div>
  </div>

​

我试着在线查看文档，但是他们要么没有在Vue.js中显示，要么只是展示如何创建图表，而不是定制图表。如果有更好的方法来绘制Vue，我愿意尝试它。我最终计划允许用户提交数据来创建图表，并可能从API中提取数据。谢谢你抽出时间来读这篇文章，也许还可以回答它！

Answer 1

PieChart的可能选项可以找到这里。

对于您的用例，它将是：

{
  "chartOptions": {
    "title": "Your Title",
    "backgroundColor": "#00cc00",
    "legend": "none"
  }
}

还要检查下面的资源，它可以在npm包的README.md文件中找到。