Echarts异步数据json传输

最新推荐文章于 2023-11-02 14:19:46 发布

原创

最新推荐文章于 2023-11-02 14:19:46 发布 · 5.7k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#Echarts #异步json #Echarts is not defin

在项目中使用Echarts制作柱状图时，遇到了一些挑战。首先，解决了Echarts is not defined的错误，通过从网络加载Echarts.js文件解决。其次，确保数据以正确的JSON格式传递，特别是异步请求时需要在URL中添加callback=?，后台返回的数据需与JSON数据一起拼接，并且JSON格式应为({categories[], data[]})。实例中展示了具体的categories和data数组内容。" 119832164,7750103,解决：Eureka与Nacos多注册中心错误处理,"['微服务', 'Spring Cloud', '服务发现', 'Eureka', 'Nacos']

今天应项目需要进行统计分析,显示炫酷的柱状图,就想到了Echarts,本来认为应该是很简单的,我花了一下午的时间才弄出来.....我将我遇到的一些问题记录下来.

首先把代码先给朋友们贴上:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="js/jquery-2.1.4.js"></script>
<title>Insert title here</title>
</head>
<body>
项目概览
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
    <div id="main" style="width: 600px;height:400px;"></div>
    <script type="text/javascript" src="http://echarts.baidu.com/buil