<!DOCTYPE html>
<html style="height:90%">
<head>
<meta charset="utf-8">
<script type="text/javascript" src="../../../script/echarts.min.js"></script>
<script type="text/javascript" src="../../../script/jquery-3.1.0.min.js"></script>
<script type="text/javascript">
document.addEventListener('plusready', DirectAjaxtest, false);
function DirectAjaxtest(){
//alert("ff");
var ajaxData = {};
ajaxData.method = "GET";
ajaxData.isBlock = true;
ajaxData.url = "http://localhost:8080/sgweb/user/query";
ajaxData.successFunction = "successFunction";
ajaxData.failFunction = "failFunction";
//设置请求编码格式
ajaxData.reqCharset = "UTF-8";
//设置回应编码格式
ajaxData.rspCharset = "UTF-8";
//设置连接超时时间 10秒
ajaxData.connectTimeout = 10;
//设置读取超时时间 90秒
ajaxData.timeout = 90;
var ajax = new DirectAjax(ajaxData);
ajax.send();
$("#lunbo").click(function(){
//alert("tt");
window.open("lunbo.html");
//history.go(-1);
});
$("#page").click(function(){
//alert("tt");
window.open("page.html");
//history.go(-1);
});
}
function successFunction(data) {
//alert(data.responseText);
var jsonData = ClientUtil.stringToJson(data.responseText);
//alert(jsonData);
InitBarTu(jsonData);
}
function failFunction(){
alert("fail");
}
function InitBarTu(jsonData){
var data=jsonData;
//alert(data.key[0].name);
var valuedata=[];
var namedata=[];
for(var i=0;i<data.key.length;i++)
{
namedata.push(data.key[i].name);
//alert(data.key[i].name);
valuedata.push(data.key[i].age);
//alert(data.key[i].age);
}
var dom = document.getElementById("container");
var myChart = echarts.init(dom);
var app = {};
option = null;
option = {
xAxis: {
type: 'category',
data: namedata
},
yAxis: {
type: 'value'
},
series: [{
data: valuedata,
type: 'bar'
}]
};
if (option && typeof option === "object") {
myChart.setOption(option, true);
}
}
</script>
</head>
<body style="height: 90%; margin: 0">
<div id="container" style="height: 100%"></div>
<input type="button" value="轮播" id="lunbo"></input>
<input type="button" value="分页" id="page"></input>
</body>
</html>