highcharts可变宽度饼图的引用和json数组的传参

demo链接：https://github.com/hehaoxiang/SpringBootPractice.git
可变宽度环形图：https://www.highcharts.com.cn/demo/highcharts/variable-radius-pie）

前台代码的：

 <div id="left" class="bottom"></div>
 <script th:inline="javascript">
 var thyarg_arr = [[${arr}]]  ;
//可变宽度饼图，后台要传过来的json数组的key值要对应为小写，否则无法接收数据
var chart3 = Highcharts.chart('center', {
    chart: {
        type: 'variablepie'
    },
    title: {
        text: '白白'
    },
    tooltip: {
        headerFormat: '',
        pointFormat: '<span style="color:{point.color}">\u25CF</span> <b> {point.name}</b><br/>' +
       '金额: <b>{point.y}</b>'+'日期: <b>{point.z}</b><br/>'
    },
    series: [{
        minPointSize: 10,
        innerSize: '20%',
        zMin: 0,
        name: 'earea',
        data:thyarg_arr
    }]
});
</script>

后台代码

package com.example.demo.controller;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
/*在pom.xml添加
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>fastjson</artifactId>
<version>1.2.47</version>
</dependency>
在返回json数组时使用到
*/
import com.alibaba.fastjson.JSON;
import com.alibaba.fastjson.JSONArray;
import com.alibaba.fastjson.JSONObject;
import org.springframework.beans.factory.annotation.Autowired;
/*关联Oracle数据库
<dependency>
<groupId>com.oracle</groupId>
<artifactId>ojdbc6</artifactId>
<version>11.2.0.3</version>
</dependency>
*/
import org.springframework.jdbc.datasource.DriverManagerDataSource;
import org.springframework.jdbc.core.JdbcTemplate;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;



@Controller	

public class EcardSum {
//依赖注入
	@Autowired
	JdbcTemplate jdbcTemplate;
	//当执行时,输入路径test时，就会执行下面的testJ这个方法
	@GetMapping("/test")
	 public String testJson(Model model) {
      //gxl,创建数据库的连接
		DriverManagerDataSource dataSource=new DriverManagerDataSource();
        dataSource.setDriverClassName("oracle.jdbc.driver.OracleDriver");
        dataSource.setUrl("jdbc:oracle:thin:@ (DESCRIPTION =  (ADDRESS_LIST = (ADDRESS = (PROTOCOL = TCP)(HOST = xx.xxx.xxx.xx)(PORT = 1521))  ) (CONNECT_DATA = (SERVICE_NAME = pdb_test) ) )");
        dataSource.setUsername("gxl");
        dataSource.setPassword("gxl");
        JdbcTemplate jdbcTemplate=new JdbcTemplate(dataSource);
        //记得这样子添加 \"name\"才会固定key值为小写，如果只写name则会默认全部大写
		  String sql5 ="\r\n" + 
				    "select a.areacode as \"name\",b.ext11 as \"y\",to_number(to_char(b.opertime,'yyyymmdd')) \"z\" from si_balance b , opr_register a where b.regid= a.regid\r\n" + 
				    "and a.qrflag='1' "; 
			 Map map5 = new HashMap();
			List<Map<String, Object>> listMap1 =  jdbcTemplate.queryForList(sql5);
			 ArrayList areaList = new ArrayList();
			 JSONArray areaJsonArray = new JSONArray();
			 
			 for(int i=0;i<listMap1.size()  ;i++)
			 {
				 map5 = listMap1.get(i) ; 
				 areaList.add(map5);
			 }
			  areaJsonArray = JSON.parseArray(JSONObject.toJSONString(areaList));
			  model.addAttribute("arr",areaJsonArray);
			  return("rest")
			  }