echarts折线图获取mysql,ECharts获取数据库中的内容

最新推荐文章于 2024-08-09 20:19:59 发布

想吃草莓干

最新推荐文章于 2024-08-09 20:19:59 发布

阅读量1.2k

点赞数

文章标签： echarts折线图获取mysql

本文介绍了如何使用ECharts从MySQL数据库获取数据并绘制折线图。作者在过程中遇到问题，如JQuery未定义、数据不完整等，并通过调整AJAX请求和同步设置解决了这些问题。通过定义getXX()函数，分别获取横坐标月份和纵坐标蒸发量，成功实现了数据与图表的结合。最后展示了相关后台处理代码。

摘要由CSDN通过智能技术生成

echarts是一个对于我完全陌生的事务，也许，它曾经出现在某个我浏览的网页上，但我是真的不认识它。哎，官网也真是的，每次给的demo全是死的数据，你让我们这些什么都不会的人怎么看啊。哪还有人用死的数据啊。网上的解决方法也大都是php什么的，看了也白看，只能自己来了。

这里的示例本来是一个降水量的柱形图，我在数据库创建了一个demo表，字段有：mon,jsl,zfl。让图表横坐标显示月份，柱形图显示蒸发量(zfl)。需要注意的是，在开始写的时候google的控制台一直报错，说$没有定义，查了一下，说是jquery要放在做前面，我试了一下还是不行，后来发现是路径的问题。

主要的解决方法就是将 xAxis 、 series 中的date改成调用别的方法。在这里使用了getXX()来获取数组。由于对hibernate也不是很了解，我利用sql查询表中的一个字段时返回出了错。于是又自己写了一个方法，调用查询所有的信息，在利用数组和for循环将值传到数组中，返回到js中。本来在网上查找到的ajax方法是这样写的：

function getMonth(){

var arrStr = new Array();

$.ajax({

type: "POST",

url: "syncData.jsp?line=0&r="+Math.random(),

dataType:"text",

async:false, //同步

success: function(data){