恭喜你找到真正的解决方法
网上的方法都是驴唇不对马嘴,先了解一下json几个常用方法
JSON
依赖:
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>fastjson</artifactId>
<version>1.2.54</version>
</dependency>
String s = JSON.toJSONString(user);
就是成了字符串
JSONObject的数据是用 { } 来表示的,
依赖:
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>fastjson</artifactId>
<version>1.2.54</version>
</dependency>
例如: { “id” : “123”, “courseID” : “huangt-test”, “title” : “提交作业”, “content” : null }
JSONArray
依赖:跟前两个不一样,注意导包!!!上面依赖只能转字符串,而这个直接转list对象!!
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.8.3</version>
</dependency>
<dependency>
<groupId>net.sf.json-lib</groupId>
<artifactId>json-lib</artifactId>
<version>2.2.3</version>
<classifier>jdk15</classifier><!-- 指定jdk版本 -->
</dependency>
JSONArray jsonarr = JSONArray.fromObject(nameToValueList);这是list对象,也就是正解
例如: [ { “id” : “123”, “courseID” : “huangt-test”, “title” : “提交作业” } , { “content” : null, “beginTime” : 1398873600000 “endTime” } ] ;
表示了包含2个JSONObject的JSONArray。
用于EChart传的json数据格式
附上解决流程:
1.导入依赖(不是fastjson)
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.8.3</version>
</dependency>
<dependency>
<groupId>net.sf.json-lib</groupId>
<artifactId>json-lib</artifactId>
<version>2.2.3</version>
<classifier>jdk15</classifier><!-- 指定jdk版本 -->
</dependency>
2.后台
//正式临时工的对比数据
List<NameToValue> nameToValueList=new ArrayList<>();
NameToValue nameToValueNormal=new NameToValue(0,"正式工");
NameToValue nameToValueTmp=new NameToValue(0,"临时工");
nameToValueList.add(nameToValueTmp);
nameToValueList.add(nameToValueNormal);
//直接转,简单粗暴
JSONArray jsonarr = JSONArray.fromObject(nameToValueList);
model.addAttribute("pieChart", jsonarr);
return prefix+"list";
3.前台
<script type="text/javascript" th:inline="javascript">
// 基于准备好的dom,初始化echarts实例
var myChart = echarts.init(document.getElementById('pieChart'));
var massage =[[${pieChart}]];//thymeleaf在js获取数据
console.log(massage);
// 指定图表的配置项和数据
var option = {
series : [
{
name: '访问来源',
type: 'pie',
radius: '55%',
roseType: 'angle',
data:massage
}
]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
</script>