定制echarts3.0饼图

来源:互联网 发布:与朋友交而不信乎的与 编辑:程序博客网 时间:2024/05/21 07:14
/** * Customized Pie(定制饼图) * @param obj * @param data * @param params */function getCustomizedPie(obj,data,params){// 定制饼图默认参数var params_pie = {isTitle : true,titleLeft : "center",titleMaginTop : 20,isVisualMapShow :false,visualMapMin : 10,visualMapMax : 1000,isLegend : false,legendOrient : "horizontal",legendLeft : "center",legendTop : "bottom",isToolbox : false,toolboxOrient : "horizontal",toolboxLeft : "right",toolboxTop : "top",radius : "55%",left : "50%",top : "50%",labelLineSmooth : 0.2,labelLineLength : 10,labelLineLength2 : 20,// 回调函数func : null};// 处理参数if (typeof params == "object") {if (params == null) {params = params_pie;} else {params = mix(params_pie, params, true);}} else {params = params_pie;}var num = "[" + data.data + "]";var legend = "[" + data.legend + "]";num = eval(num);legend = eval(legend);var option = {backgroundColor: '#2c343c',    title: {    show : params.isTitle,text : data.title,subtext : '',        left: params.titleLeft,        top: params.titleMaginTop,        textStyle: {            color: '#ccc'        }    },    tooltip : {        trigger: 'item',        formatter: "{a} <br/>{b} : {c} ({d}%)"    },    visualMap: {        show: params.isVisualMapShow,        min: params.visualMapMin,        max: params.visualMapMax,        inRange: {            colorLightness: [0, 1]        }    },    legend : {show : params.isLegend,orient : params.legendOrient,// vertical/horizontalleft : params.legendLeft,top : params.legendTop,data : legend},toolbox : {show : params.isToolbox,orient : params.toolboxOrient,left : params.toolboxLeft,top : params.toolboxTop,feature : {dataView : {readOnly : false},restore : {},saveAsImage : {}}},    series : [        {            name:'访问来源',            type:'pie',            radius : params.radius,            center: [params.left, params.top],            data: num.sort(function (a, b) { return a.value - b.value}),            roseType: 'angle',            label: {                normal: {                    textStyle: {                        color: 'rgba(255, 255, 255, 0.3)'                    }                }            },            labelLine: {                normal: {                    lineStyle: {                        color: 'rgba(255, 255, 255, 0.3)'                    },                    smooth: params.labelLineSmooth,                    length: params.labelLineLength,                    length2: params.labelLineLength2                }            },            itemStyle: {                normal: {                    color: '#c23531',                    shadowBlur: 200,                    shadowColor: 'rgba(0, 0, 0, 0.5)'                }            },            animationType: 'scale',            animationEasing: 'elasticOut',            animationDelay: function (idx) {                return Math.random() * 200;            }        }    ]};var myChart = echarts.init(document.getElementById(obj));if(params.func){myChart.on('click', function(para) {// 下面写回调函数params.func(para.data.data_id);});}myChart.setOption(option);}

0 0