zoukankan      html  css  js  c++  java
  • 小小的封装了一个pie的echarts

    function showData(ele,arr1,arr2){
        var myChart2 = echarts.init(document.getElementById(ele));
        var option2 = {
            tooltip : {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c} ({d}%)"
            },
            legend: {
                orient : 'vertical',
                x : 'left',
                data:[arr1[0],arr1[1],arr1[2],arr1[3],arr1[4]]
            },
            toolbox: {
                show : true,
                feature : {
                    mark : {show: true},
                    dataView : {show: true, readOnly: false},
                    magicType : {
                        show: true,
                        type: ['pie', 'funnel'],
                        option: {
                            funnel: {
                                x: '25%',
                                 '50%',
                                funnelAlign: 'center',
                                max: 1548
                            }
                        }
                    },
                    restore : {show: true},
                    saveAsImage : {show: true}
                }
            },
            calculable : true,
            series : [
                {
                    name:'访问来源',
                    type:'pie',
                    radius : ['50%', '70%'],
                    itemStyle : {
                        normal : {
                            label : {
                                show : false
                            },
                            labelLine : {
                                show : false
                            }
                        }
    
                    },
                    data:[
                        {value:arr2[0], name:arr1[0]},
                        {value:arr2[1], name:arr1[1]},
                        {value:arr2[2], name:arr1[2]},
                        {value:arr2[3], name:arr1[3]},
                        {value:arr2[4], name:arr1[4]}
                    ]
                }
            ]
        };
        myChart2.setOption(option2)
    }
        var a = '直接访问';
        var b = '邮件营销';
        var c = '联盟广告';
        var d = '视频广告';
        var e = '搜索引擎';
        var arr1 = [a, b, c, d, e];
        var arr2 = [12, 23, 34, 45, 56];
    showData("main2",arr1,arr2);
    

      只需要传入div的id和数据里面的对象数组

  • 相关阅读:
    @RestController
    spring-boot入门环境
    spring事务管理
    Spring和hibernate框架整合
    python的for循环及数组
    PreparedStatement防止SQL注入
    python入门
    maven 依赖规则&版本锁定
    使用eclipse创建一个简单的maven项目
    maven常用命令 (1)
  • 原文地址:https://www.cnblogs.com/shixingwen/p/6006096.html
Copyright © 2011-2022 走看看