使用echarts实现雷达图

<%@ page language=“java” contentType=“text/html; charset=utf-8”
pageEncoding=“utf-8”%>
<%@ taglib uri=“http://java.sun.com/jsp/jstl/core” prefix=“c”%>
<%@taglib prefix=“sec” uri="/WEB-INF/tags/shiro.tld"%>
<%@taglib prefix=“pt6” uri="/WEB-INF/tags/platform6.tld"%>
<%@ page import=“avicit.platform6.commons.utils.ViewUtil”%>

});

function seachPMData(period, type){
pmPeriod = nowPeriod;
$.ajax({
url : “platform/jsc/bibsccenterjxtj/BibscCenterJxtjController/operation/queryDJData”,
type : ‘post’,
data : {
jxDeptType : deptType,
jxPeriod : pmPeriod
},
dataType : ‘json’,
success : function® {
var dataList = r.result;
var outName = new Array();
var inValue = new Array();
var inName = {};
if(r.result.length > 0){
for(var i=0;i<r.result.length;i++){
var obj1 = {};
obj1.text = r.result[i][“JX_DEPT”];
obj1.max = r.result[i][“MAX_VALUE”];
obj1.min = r.result[i][“MIN_VALUE”];
outName[i] = obj1;

				inValue[i] = r.result[i]["JX_VALUE"];
				inName.name = r.result[i]["JX_PERIOD"];
			}
			var obj2 = { name :  inName.name , value : inValue};
			var finalResult = new Array();
			finalResult.push(obj2);
		}
		autoLoadChart("radar", "jxOrderByDivId", "", finalResult, "", outName, nowPeriod + deptType);
	}
});

}
function toOpenDetail(){
var url = “avicit/jsczxc/bibsccenterdy/BibscCenterDJDetail.jsp?deptType=” + encodeURI(deptType);
window.open(href + url,’’,‘width=’+(window.screen.availWidth-10)+’,height=’+(window.screen.availHeight-30)+ ‘,top=0,left=0’);
}

//‘line’（折线图） | ‘bar’（柱状图） | ‘scatter’（散点图） | ‘k’（K线图）
// ‘pie’（饼图） | ‘radar’（雷达图） | ‘chord’（和弦图） | ‘force’（力导向布局图） | ‘map’（地图）
function autoLoadChart(chartType,id,kpiName,value,planUnitName, str1, str2){
var _self = this;
var chartDiv = document.getElementById(id);
var myChart = echarts.getInstanceByDom(chartDiv);
if(typeof(myChart) != ‘undefined’) {
myChart.dispose();
}
//用于使chart自适应高度和宽度,通过窗体高宽计算容器高宽
var resizeWorldMapContainer = function () {
chartDiv.style.width = document.getElementById(id).offsetWidth + ‘px’;
chartDiv.style.height = document.getElementById(id).offsetHeight + ‘px’;
}
//设置容器高宽
resizeWorldMapContainer();
myChart = echarts.init(chartDiv);
var option = {};
if(chartType == “radar”){
option = getRadarOption(kpiName, value, str1, str2);
}
myChart.setOption(option);
//用于使chart自适应高度和宽度
window.onresize = function () {
//重置容器高宽
resizeWorldMapContainer();
myChart.resize();
};
myChart.on(‘click’, function (param) {
//alert(param.name + “—” + param.value);
});
}

function getRadarOption(name, dataList, list, title){
option = {
title: {
text: title,
left : ‘center’,
top : 0,
textStyle: {
color: ‘#ccc’//标题颜色
}
},
tooltip: {
position: [‘50%’, ‘20%’]//调整提示框的位置
},
legend: {
data: [],//图例
},
radar: {
indicator: list,
center: [‘50%’,‘50%’],//调整图的整体位置
radius: 80//调整图的整体大小
},
series: [{
name: ‘’,
type: ‘radar’,
itemStyle: {
normal:{
areaStyle: {type: ‘default’},//此属性控制雷达图展示面积图
color: ‘#FF6600’,
}
},
data : dataList
}]
};
return option;
}