ECharts与Java进行后台交互入门教程（1）

这篇是简单入门，与 Java 后台交互请移驾：https://blog.csdn.net/m0_37574389/article/details/81360526

 

简单介绍一些ECharts：

Echarts (http://echarts.baidu.com/)是百度公司出品的，遵循 BSD 开源协议，免费商用，算是百度不可多得的良心之作。要彻底掌握Echarts，你需要掌握一点前端开发的知识，这些知识也是你花几周的时间就可以学会的（这里需要你掌握一点html、css、javascript的知识）。不过即使是小白，也能发现它大大的有用，话不多少，我们直接上案例，通过案例，我们来说明这个神器强大之处。

 

获取 ECharts：

你可以通过以下几种方式获取 ECharts。

1. 从官网下载界面选择你需要的版本下载，根据开发者功能和体积上的需求，我们提供了不同打包的下载，如果你在体积上没有要求，可以直接下载完整版本。开发环境建议下载源代码版本，包含了常见的错误提示和警告。

2. 在 ECharts 的 GitHub 上下载最新的 release 版本，解压出来的文件夹里的 dist 目录里可以找到最新版本的 echarts 库。

3. 通过 npm 获取 echarts，npm install echarts --save，详见“在 webpack 中使用 echarts”

4. cdn 引入，你可以在 cdnjs，npmcdn 或者国内的 bootcdn 上找到 ECharts 的最新版本

 

引入 ECharts：

引入方式很简单，只需要像普通的 JavaScript 库一样用 script 标签引入。

绘制一个简单的图表：

在绘图前我们需要为 ECharts 准备一个具备高宽的 DOM 容器。

然后就可以通过 echarts.init() 方法初始化一个 echarts 实例并通过setOption()方法生成

一个简单的柱状图，下面是完整代码。

 

这样图表就诞生了，但是这是前台固定了的，接下来我们就试一试从后台取数实现动态的折线图。