echarts 动态数据交互实例

最近在学习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>

评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值