【转载自:http://echarts.baidu.com/echarts2/doc/start.html】

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <title>ECharts</title>
</head>
<body>
  <!-- 为ECharts准备一个具备大小(宽高)的Dom -->
  <div id="main" style="height:400px"></div>
  <!-- ECharts单文件引入 -->
  <script src="${pageContext.request.contextPath}/lib/echart/dist/echarts.js"></script>
  <script type="text/javascript">
  // 路径配置
    require.config({
    paths: {
    echarts: '${pageContext.request.contextPath}/lib/echart/dist'
      }
    });

// 使用
require(
[
  'echarts',
  'echarts/chart/bar' // 使用柱状图就加载bar模块,按需加载
],
function (ec) {
  // 基于准备好的dom,初始化echarts图表
  var myChart = ec.init(document.getElementById('main'));

  var option = {
  //提示
  tooltip: {
    show: true
  },
  //图例
  legend: {
    data:['销量']
  },
  //X轴
  xAxis : [
  {
    type : 'category',
    data : ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
  }
  ],
  //Y轴
  yAxis : [
  {
    type : 'value'
  }],
series : [{
  "name":"销量",
  "type":"bar",
  "data":[5, 20, 40, 10, 10, 20]
}]
};

  // 为echarts对象加载数据
  myChart.setOption(option);
  }
);
</script>
</body>

Echart的简单例子的更多相关文章

  1. Hibernate4.2.4入门(一)——环境搭建和简单例子

    一.前言 发下牢骚,这段时间要做项目,又要学框架,搞得都没时间写笔记,但是觉得这知识学过还是要记录下.进入主题了 1.1.Hibernate简介 什么是Hibernate?Hibernate有什么用? ...

  2. AgileEAS.NET SOA 中间件平台.Net Socket通信框架-简单例子-实现简单的服务端客户端消息应答

    一.AgileEAS.NET SOA中间件Socket/Tcp框架介绍 在文章AgileEAS.NET SOA 中间件平台Socket/Tcp通信框架介绍一文之中我们对AgileEAS.NET SOA ...

  3. spring mvc(注解)上传文件的简单例子

    spring mvc(注解)上传文件的简单例子,这有几个需要注意的地方1.form的enctype=”multipart/form-data” 这个是上传文件必须的2.applicationConte ...

  4. ko 简单例子

    Knockout是在下面三个核心功能是建立起来的: 监控属性(Observables)和依赖跟踪(Dependency tracking) 声明式绑定(Declarative bindings) 模板 ...

  5. mysql定时任务简单例子

    mysql定时任务简单例子 ? 1 2 3 4 5 6 7 8 9     如果要每30秒执行以下语句:   [sql] update userinfo set endtime = now() WHE ...

  6. java socket编程开发简单例子 与 nio非阻塞通道

    基本socket编程 1.以下只是简单例子,没有用多线程处理,只能一发一收(由于scan.nextLine()线程会进入等待状态),使用时可以根据具体项目功能进行优化处理 2.以下代码使用了1.8新特 ...

  7. 一个简单例子:贫血模型or领域模型

    转:一个简单例子:贫血模型or领域模型 贫血模型 我们首先用贫血模型来实现.所谓贫血模型就是模型对象之间存在完整的关联(可能存在多余的关联),但是对象除了get和set方外外几乎就没有其它的方法,整个 ...

  8. [转] 3个学习Socket编程的简单例子:TCP Server/Client, Select

    以前都是采用ACE的编写网络应用,最近由于工作需要,需要直接只用socket接口编写CS的代码,重新学习这方面的知识,给出自己所用到的3个简单例子,都是拷贝别人的程序.如果你能完全理解这3个例子,估计 ...

  9. jsonp的简单例子

    jsonp的简单例子 index.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8&q ...

随机推荐

  1. .NET应用架构设计—面向对象分析与设计四色原型模式(彩色建模、领域无关模型)(概念版)

    阅读目录: 1.背景介绍 2.问自己,UML对你来说有意义吗?它帮助过你对系统进行分析.建模吗? 3.一直以来其实我们被一个缝隙隔开了,使我们对OOAD遥不可及 4.四色原型模式填补这个历史缝隙,让我 ...

  2. PXC(Percona XtraDB Cluster)集群的安装与配置

    Percona XtraDB Cluster是针对MySQL用户的高可用性和扩展性解决方案,基于Percona Server .其包括了Write Set REPlication补丁,使用Galera ...

  3. linux下shell脚本执行jar文件

    最近在搞一个shell脚本启动jar文件个关闭jar文件的东东.搞得我都蛋疼了.今天晚上终于弄好了 话说,小弟的linux只是刚入门,经过各方查资料终于搞定了.话不多说,下面开始上小弟写的shell脚 ...

  4. WPF Prism

    简介   图解   参考 Using the Model-View-ViewModel Pattern

  5. JS 阶段小练习~ 无缝滚动

    结合下学了的知识,做个模拟的综合性扩展练习~~  大致功能如下: 1.点开html后,图片自动移动展示 2.点击左右方向,可以改变 图片移动的方向(改变left的值,正负) 3.鼠标移入移出图片后,图 ...

  6. TCP 连接的建立和释放

    TCP(Transmission Control Protocol) 传输控制协议 1.三次握手协议(建立连接) TCP是主机对主机层的传输控制协议,提供可靠的连接服务,采用三次握手确认建立一个连接: ...

  7. 使用JS实现前端缓存

    在前端浏览器中,有些数据(比如数据字典中的数据),可以在第一次请求的时候全部拿过来保存在js对象中,以后需要的时候就不用每次都去请求服务器了.对于那些大量使用数据字典来填充下拉框的页面,这种方法可以极 ...

  8. Linux操作系统启动流程梳理

    接触linux系统运维已经好几年了,常常被问到linux系统启动流程问题,刚好今天有空来梳理下这个过程:一般来说,所有的操作系统的启动流程基本就是: 总的来说,linux系统启动流程可以简单总结为以下 ...

  9. 从数据库导出到excel

    在项目 扬中 News shenbaocreateall //选中的id string cc = Request["IDcheck"];            Response.C ...

  10. Js前端代码异常监控

    window.onerror = function(msg,url,line,col,error){ //没有URL不上报!上报也不知道错误 if (msg != "Script error ...