<template>
  <div ref="main" style="width:400px ;height:300px;"></div>
</template>

<script>
import * as echarts from "echarts";

export default {
  name: "NightingaleCharData",
  mounted() {
    this.getPie()
  },
  /* props:{
     resultData: {
       type: Array,
       default:()=> [
         { name: '出让', value: 20 },
         { name: '划拨', value: 15},
         { name: '作价出资', value: 20 },
         { name: '转让', value: 35 },
         { name: '其他', value: 50 },]
     },
     titleText:{
       type:String,
     }
   },
   watch:{
     resultData(){
       this.$nextTick(function() {
         this.getPie()
       })
     }
   },*/
  methods: {
    getPie() {
      // 绘制图表
      var myChart = echarts.init(this.$refs.main)
      // 指定图表的配置项和数据
      var option = {
        legend: {
          left: '0',
          orient: 'vertical',
        },
        // toolbox: {
        //   show: true,
        //   feature: {
        //     mark: { show: true },
        //     dataView: { show: true, readOnly: false },
        //     restore: { show: true },
        //     saveAsImage: { show: true }
        //   }
        // },
        series: [
          {
            name: 'Nightingale Chart',
            type: 'pie',
            radius: [50, 120],
            center: ['50%', '50%'],
            roseType: 'area',
            itemStyle: {
              borderRadius: 8
            },
            data: [
              { value: 40, name: 'rose 1' },
              { value: 38, name: 'rose 2' },
              { value: 32, name: 'rose 3' },
            ]
          }
        ]
      };

      // 使用刚指定的配置项和数据显示图表。
      myChart.setOption(option)


    }
  }
}
</script>

<style scoped>

</style>