首頁猿問 echarts頁面json接收的后...

echarts頁面json接收的后臺數(shù)據(jù)頁面不展現(xiàn)

JavaScript JQuery

慕婉清2201325 2017-09-15 12:07:37

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%><%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %><%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %><!DOCTYPE html><head> ? ?<meta charset="utf-8"> ? ?<title>ECharts</title></head><body><div id="main" style="height:400px"></div><script src="http://echarts.baidu.com/build/dist/echarts.js"></script><script type="text/javascript"> ? ?// 路徑配置 ? ?require.config({ ? ? ? ?paths: { ? ? ? ? ? ?echarts: 'http://echarts.baidu.com/build/dist' ? ? ? ?} ? ?}); ? ?// 使用 ? ?require( ? ? ? ? ? ?[ ? ? ? ? ? ? ? ?'echarts', ? ? ? ? ? ? ? ?'echarts/chart/bar' // 使用柱狀圖就加載bar模塊，按需加載 ? ? ? ? ? ?], ? ? ? ? ? ?function (ec) { ? ? ? ? ? ? ? ?// 基于準備好的dom，初始化echarts圖表 ? ? ? ? ? ? ? ?var myChart = ec.init(document.getElementById('main')); ? ? ? ? ? ? ? ?var option = { ? ? ? ? ? ? ? ? ? ?title:{ ? ? ? ? ? ? ? ? ? ? ? ?show:true, ? ? ? ? ? ? ? ? ? ? ? ?text:'這是一個柱狀圖' ? ? ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ? ? ?toolbox:{ ? ? ? ? ? ? ? ? ? ? ? ?show:true, ? ? ? ? ? ? ? ? ? ? ? ?//添加頁面上的按鈕 ? ? ? ? ? ? ? ? ? ? ? ?feature:{ ? ? ? ? ? ? ? ? ? ? ? ? ? ?dataView:{ ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?show:true ? ? ? ? ? ? ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ? ? ? ? ? ? ?restore:{ ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?show:true ? ? ? ? ? ? ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ? ? ? ? ? ? ?dataZoom:{ ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?show:true ? ? ? ? ? ? ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ? ? ? ? ? ? ?saveAsImage:{ ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?show:true ? ? ? ? ? ? ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ? ? ? ? ? ? ?magicType:{ ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?type:['line','bar'] ? ? ? ? ? ? ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ? ? ?tooltip: { ? ? ? ? ? ? ? ? ? ? ? ?show: true ? ? ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ? ? ?legend: { ? ? ? ? ? ? ? ? ? ? ? ?data:['年齡'] ? ? ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ? ? ?xAxis : [ ? ? ? ? ? ? ? ? ? ? ? ?{ ? ? ? ? ? ? ? ? ? ? ? ? ? ?type : 'category', ? ? ? ? ? ? ? ? ? ? ? ? ? ?data : [] ? ? ? ? ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ? ? ?], ? ? ? ? ? ? ? ? ? ?yAxis : [ ? ? ? ? ? ? ? ? ? ? ? ?{ ? ? ? ? ? ? ? ? ? ? ? ? ? ?type : 'value' ? ? ? ? ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ? ? ?], ? ? ? ? ? ? ? ? ? ?series : [ ? ? ? ? ? ? ? ? ? ? ? ?{ ? ? ? ? ? ? ? ? ? ? ? ? ? ?name:'年齡', ? ? ? ? ? ? ? ? ? ? ? ? ? ?type:"bar", ? ? ? ? ? ? ? ? ? ? ? ? ? ?data:[] ? ? ? ? ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ? ? ?] ? ? ? ? ? ? ? ?}; ? ? ? ? ? ? ? ?var names = []; ? ? ? ? ? ? ? ?var ages = []; ? ? ? ? ? ? ? ?$.ajax({ ? ? ? ? ? ? ? ? ? ?type:"post", ? ? ? ? ? ? ? ? ? ?async:true, ? ? ? ? ? ? ? ? ? ?url:"findAll", ? ? ? ? ? ? ? ? ? ?data:{}, ? ? ? ? ? ? ? ? ? ?dataType:"json", ? ? ? ? ? ? ? ? ? ?success:function (result) { ? ? ? ? ? ? ? ? ? ? ? ?if(result){ ? ? ? ? ? ? ? ? ? ? ? ? ? ?for(var i=0;i<result.length;i++){ ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?names.push(result[i].name); ? ? ? ? ? ? ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ? ? ? ? ? ? ?for(var i=0;i<result.length;i++){ ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?ages.push(result[i].age) ? ? ? ? ? ? ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ? ? ? ? ? ? ?myChart.setOption({ ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?xAxis:{ ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?data:names ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?series:{ ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?name:'年齡', ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?data:ages ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ? ? ? ? ? ? ?}); ? ? ? ? ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ?});// ? ? ? ? ? ? ? ?// 為echarts對象加載數(shù)據(jù)// ? ? ? ? ? ? ? ?myChart.setOption(option); ? ? ? ? ? ?} ? ?);</script></body>

查看完整描述