VUE中 ECHART餅圖各扇區間加空格 及 消除鼠標放到扇區上隱藏第一行

1、餅圖的扇區間加空白間隔 

series : [{
    name: '',
    type: 'pie',
    radius: ['35%', '60%'],
    center: ['50%', '50%'],
    itemStyle: {
          normal: {
              borderWidth: 4, //扇區間加間隔
              borderColor: '#ffffff', //間隔爲白色
              label:{ 
                  show: true, 
                  formatter: '{b} : {d}%' 
              }, 
              labelLine :{
                  show:true
              }
         }
     },
     data:[]
}]

 

2、鼠標放到扇區上隱藏第一行,只顯示第二行

<template>
    <div id="echartPie" style="width:100%;height:360px;"></div>
</template>

<script>
    mounted() {
        /*餅圖綁定*/
        let myEchartPie = echarts.init(document.getElementById('echartPie'));
        myWarnInfPie.setOption(this.warnInfOption);/*綁定數據*/
    },
</script>

<style>
#echartPie > div:nth-child(2) > br{
    display: none;
}
</style>

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章