zoukankan      html  css  js  c++  java
  • 两个圆同一个页面

    var colors=[
                        '#6EB6F2','#71F16F','#FFC000','#384C6C','#7577F8',
                        '#003366','#AEABAF','#00F4D2','#8084F1','#FF9F4E',
                        '#4FA2A9','#9a7fd1','#588dd5','#f5994e','#c05050',
                        '#59678c','#c9ab00','#7eb00a','#6f5553','#c14089',
                        '#FF4F7F','#CC6666','#7f7522','#2b4490','#333399',
                        '#70a19f','#009299','#78331e','#3e4145','#7bbfea',
                        '#339999','#8f4b38','#694d9f','#f26522','#8e7437',
                        '#45b97c','#74787c','#afdfe4','#fdb933','#bed742',
                        '#A20055','#AA0000','#C63300','#0000AA','#2200AA',
                        '#990099','#00AAAA','#00AA88','#00AA55','#FF1493'
                    ];
    option = {
        title : {
            text: '某站点用户访问来源',
            subtext: '纯属虚构',
            x:'center'
        },
        tooltip : {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        legend: {
            orient: 'vertical',
            left: 'right',
            data: ['直达','营销广告']
        },
        series : [
            {
                name: '访问来源',
                type: 'pie',
                radius : '55%',
                center: ['25%', '50%'],
                data:[
                    {value:335, name:'1'},
                    {value:310, name:'2'},
                    {value:234, name:'3'},
                    {value:135, name:'4'},
                    {value:1548, name:'5'}
                ],
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            },
            {
                name:'访问来源',
                type:'pie',
                radius: [0, '30%'],
                center: ['75%', '50%'],
                data:[
                    {value:335, name:'直达', selected:true},
                    {value:679, name:'营销广告'},
                    
                ]
            },
            {
                name:'访问来源',
                type:'pie',
                center: ['75%', '50%'],
                radius: ['40%', '55%'],
                label:{
                      normal:{
                          formatter:function (params) {
                          if(params.value != 0)
                              return params.data.name;
                          else
                              return '';
                      }
                      }
                  },
                data:[
                    {value:335, name:'直达',type:"直达",itemStyle:{
                            normal:{
                                color:colors[Math.floor(40*Math.random())]
                            }}},
                    {value:310, name:'直达',type:"邮件营销",itemStyle:{
                            normal:{
                                color:colors[Math.floor(40*Math.random())]
                            }}},
                    {value:234, name:'直达',type:"联盟广告",itemStyle:{
                            normal:{
                                color:colors[Math.floor(40*Math.random())]
                            }}},
                    {value:135, name:'直达',type:"视频广告",itemStyle:{
                            normal:{
                                color:colors[Math.floor(40*Math.random())]
                            }}},
                    {value:1048, name:'营销广告',type:"百度",itemStyle:{
                            normal:{
                                color:colors[Math.floor(40*Math.random())]
                            }}},
                    {value:251, name:'营销广告',type:"谷歌",itemStyle:{
                            normal:{
                                color:colors[Math.floor(40*Math.random())]
                            }}},
                    {value:147, name:'营销广告',type:"必应",itemStyle:{
                            normal:{
                                color:colors[Math.floor(40*Math.random())]
                            }}},
                    {value:102, name:'营销广告',type:"其他",itemStyle:{
                            normal:{
                                color:colors[Math.floor(40*Math.random())]
                            }}}
                ]
            }
        ]
    };

     

  • 相关阅读:
    51 数据中重复的数字
    64 数据流中的中位数
    79. Word Search
    93. Restore IP Addresses
    547. Friend Circles
    Epplus Excel 导入 MSSQL 数据库
    用来更新服务的bat 脚本
    ASP.Net MVC 引用动态 js 脚本
    8、结构的构造器应该显式调用!!!(坑)
    Task 线程重用导致等待!
  • 原文地址:https://www.cnblogs.com/sunBinary/p/10077709.html
Copyright © 2011-2022 走看看