從列子知道數據是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
?? ??? ??? ?}]
?? ??? ?});
??? }

轉載于:https://www.cnblogs.com/liuyun-10/p/6806311.html

總結

以上是生活随笔為你收集整理的highcharts中pie统计图获取数据的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。