Echarts地图报表,从数据库获取数据,json传值

使用百度的Echarts插件做报表:

下载地址:百度Echats下载

文档地址:文档地址


效果:


代码:





各省市访问数量分布





服务器端:

action:


package com.tm.admin.stat.action;

import java.util.List;
import java.util.TreeMap;

import net.sf.json.JSONArray;

import org.apache.struts2.json.JSONException;
import org.apache.struts2.json.JSONUtil;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Scope;
import org.springframework.stereotype.Controller;

import com.tm.admin.stat.Option;
import com.tm.admin.stat.service.ISystemStatService;
import com.tm.core.action.TmBaseAction;
import com.tm.core.annotation.TmAnnotationClass;

@TmAnnotationClass(model="stat",name="统计管理")
@Scope("prototype")
@Controller("admin.testAction")
public class TestAreaAction extends TmBaseAction{
	@Autowired
	private ISystemStatService service;
	
	public String testArea() {//第一次进入页面
		return "testArea";//返回到testArea页面
	}
	
	public void listArea() throws JSONException{
		TreeMap map=service.findAreaCounts();
		outputStr(JSONUtil.serialize(map));
		
	}
}


数据库查询   dao:


public TreeMap findAreaCounts(){
		List

==================================================================================================================================

注意返回Map ,不要使用 List

map转换成json时是这样的:     [{"湖南":"30","福建":"40","江苏":"50" }]  转换后 这是一个json对象


假如新建一个 键值对类:

Option : String name; Integer value;


返回时List

list转换成json时是这样的: [{"name":"湖南","value":"30"},{"name":"福建","value":"40"},{"name":"江苏","value":"50"}]

转换后是json对象的数组


===================================================================================

返回的json 后调用,如果是list类型的json,则需要for(key in data)遍历json对象数组key 和data[key]是数据,或者data[0].name和data[0].value是数据


如果是map类型的,则可以通过 data["湖南"] 查找到对应的值 30,这样很方便!


你可能感兴趣的:(js和css)