使用echarts图表 自定义在图表中添加内容

fm:使用echarts图表可能还需要增加一些另外的内容 哎~(三声) 来吧来吧
这样 这样 再这样 嗯~ 好简单

解释一下 这个graphic数组里面就是可以自定义添加图表中的内容,
其他的应该只要你导入过echarts图表应该都可以的看懂的

         this.chart.setOption({
            graphic: [
              {
                type: 'group',
                left: '31%',
                top:'3px',
                bottom: 130,
                margin:"0 0 0 1px",

                children: [

                  {
                    type: 'text',

                    style: {
                      fill: '#333',
                      text: [
                        '总商户数:'+this.www
                      ].join('\n'),
                      font: '14px Microsoft YaHei',

                    }
                  }
                ]
              }
            ],

            title: {
              show: true,
              text: "商户活跃度占比分析",
              x: "20%",
              y:'-2',
              textStyle: {
                fontFamily: 'Arial, Verdana, sans...',
                fontSize: 30,
                fontStyle: 'normal',
                fontWeight: 'normal',
              }
            },

            tooltip: {
              trigger: 'item',
              formatter: '{a} <br/>{b} : {c} ({d}%)',
            },
            grid: {

              width:"20%", //图例宽度
              height:"100%", //图例高度

              containLabel: true
            },
            legend: {
              left: '19%',
              top: '50',
              data: ['活跃', '普通', '沉睡']
            },

            series: [
              {
                name: '商户活跃度所占比例',
                type: 'pie',
                roseType: 'radius',
                radius: "85%",
                center: ['45%', '55%'],
                data: [
                  {value: this.data.active, name: '活跃'},
                  {value: this.data.normal, name: '普通'},
                  {value: this.data.sleep, name: '沉睡'}
                ],
                animationEasing: 'cubicInOut',
                animationDuration: 2600
              }
            ]
          })

版权声明:本文为weixin_45549016原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。