最近在学习echarts,找到了很多的资料,找起来比较麻烦,为了方便自己以后的使用,特此做个笔记。
首先是echarts如何使用,要先下载echarts相关的包,我这边提供的是echarts3.0的下载地址:http://echarts.baidu.com/download.html</p><p>
之前看到echarts2.0的引入有两种方法:模块化单文件引入和标签式单文件引入,介绍如下,感兴趣的可以看一看:http://study.163.com/course/introduction.htm?
之前在网上找了好多资料,都没有实现,自己整理了各路大神的资料,下面我将介绍一个Demo,实现动态数据交互
1,前台jsp页面</p><p>a.首先引入echarts jar包,我这里还加入了jquery jar包和bootstrap jar包,为了手机上显示美观
<!-- 移动设备优先(让项目友好的支持移动设备) -->
<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
<title>echarts动态数据交互</title>
<link rel="stylesheet" href="<%=request.getContextPath()%>/css/bootstrap.min.css">
<script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery-2.1.4.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/js/bootstrap.min.js"></script>
<script type="text/javascript" src="<%=request.getContextPath() %>/js/echarts.js"></script>
b.其次为 ECharts 准备一个具备大小(宽高)的
<body>
<div id="main" style="width: 600px;height:400px;"></div>
</body>