highcharts中pie统计图获取数据

从列子知道数据是array类型的,但不知后端传回来的数据怎样转换成应有的数据类型,下面是获取数据的方法:

/**
 * pie统计图获取的映射类
 * @author Administrator
 *
 */
public class JPicData {

    private String name;
    private double value;
    @Override
    public String toString() {
        return "JPicData [name=" + name + ", value=" + value + "]";
    }
    public JPicData(String name, double value) {
        super();
        this.name = name;
        this.value = value;
    }
    public JPicData() {
        super();
    }
    public String getName() {
        return name;
    }
    public void setName(String name) {
        this.name = name;
    }
    public double getValue() {
        return value;
    }
    public void setValue(double value) {
        this.value = value;
    }
    
    
}

   /**

controller类
     * 企业地域分布
     * @return
     */
    @RequestMapping("/qyaddr")
    public @ResponseBody List<JPicData> qyaddr(){
        List<JPicData> list = new ArrayList<JPicData>(){
            {
                add(new JPicData("泊头市",10));
                add(new JPicData("吴桥",30));
                add(new JPicData("东光县",21));
                add(new JPicData("青县",16));
            }
        };
        return list;
    }

前端ajax:

$.ajax({
            type:'post',
            url:'${pageContext.request.contextPath}/webzwc/qyaddr',
            contentType:'application/json;charset=utf-8',
            async:false,
            success:function(data){
                //定义一个数组            
                ydata = [],
                $.each(data,function(i,d){
                    ydata.push([d.name,d.value]);
                });
                qyaddr(ydata);
            }
        });

最后将pie中的data:[……]换成传入的参数就行,上代码:

function qyaddr(data){
        new Highcharts.Chart({
            chart: {
                renderTo: 'container2',
                plotBackgroundColor: null,
                plotBorderWidth: null,
                plotShadow: false
            },
            title: {
                text: ''
            },
            tooltip: {
                formatter: function() {
                    return '<b>'+ this.point.name +'</b>: '+ this.percentage.toFixed(2) +' %';
                }
            },
            plotOptions: {
                pie:{
                    allowPointSelect: true,
                    cursor: 'pointer',
                    showInLegend: true,
                    dataLabels: {
                        enabled: true,
                        color: '#000000',
                        connectorColor: '#000000',                    
                        formatter: function() {
                            return this.y;
                        }
                    }
                }
            },        
            legend:{
                borderWidth:0,
            },
            series: [{
                type: 'pie',
                name: 'pie',
                data: data
            }]
        });
    }

posted @ 2017-05-04 12:06  战旗  阅读(883)  评论(0编辑  收藏  举报