_liuz 2015-07-22 09:35:53

参考网址:http://echarts.baidu.com/doc/start.html

一、制作一个图表容器
<div id="main" style="height:400px;"></div>

二、引入echarts.js文件
<script src="http://echarts.baidu.com/build/dist/echarts.js"></script>

三、配置图表路径
require.config({
    paths:{echarts:".../dist"}
});

四、加载图表js文件
require(["echarts", "echarts/chart/bar"], loadComplete);

五、绘制图表
function loadComplete(ec) {
    var myChart = ec.init(document.getElementById("main"));
    var option = { ... }; // 图表配置信息
    myChart.setOption(option);
}

 
  
 
_liuz (北京)

愿原力与你同在。

这篇日记的标签  · · · · · ·

Echarts

推荐这篇日记的豆列  · · · · · ·  ( 全部 )

 
 

使用Echarts的五个步骤的更多相关文章

  1. 原生ajax请求的五个步骤

    //第一步,创建XMLHttpRequest对象 var xmlHttp = new XMLHttpRequest(); function CommentAll() { //第二步,注册回调函数 xm ...

  2. 用 C 语言编写 Windows 服务程序的五个步骤

    Windows 服务被设计用于需要在后台运行的应用程序以及实现没有用户交互的任务.为了学习这种控制台应用程序的基础知识,C(不是C++)是最佳选择.本文将建立并实现一个简单的服务程序,其功能是查询系统 ...

  3. ORM武器:NHibernate(三)五个步骤+简单对象CRUD+HQL

    前面的两篇文章中.我们对NHibernate已经做了大致了解 <ORM利器:NHibernate(一)简单介绍>Nhibernate的作用:攻克了对象和数据库的转化问题 <ORM利器 ...

  4. 五个步骤搞定敏捷UX设计

    互联网产品发展的速度越来越快,人们对于产品的要求也在不断的升级,这直接地导致了用户体验设计的重要性不断提升.与此同时,过去的流程冗长的设计开发模式已经不能够满足快速迭代的需要.<敏捷宣言> ...

  5. 五个步骤教你理清Redis与Memcached的区别

    欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由Super发表于云+社区专栏 memcached和redis,作为近些年最常用的缓存服务器,相信大家对它们再熟悉不过了.前两年还在学校 ...

  6. 转 脸书pop动画的五个步骤

    http://blog.csdn.net/u013741809/article/details/38511741 5 Steps For Using Facebook Pop   // 1. Pick ...

  7. AJAX应用的五个步骤

    1.建立xmlHttpRequest对象 if(window.XMLHttpRequest) {    xmlHttp = new XMLHttpRequest();    if(xmlHttp.ov ...

  8. C#读取XML文件的五个步骤

    //1.创建XmlDocument对象 XmlDocument  xmlDoc=new XmlDocument(); //2.加载源文件 xmlDoc.Load("文件名.xml" ...

  9. 用C语言编写Windows服务程序的五个步骤

    Windows 服务被设计用于需要在后台运行的应用程序以及实现没有用户交互的任务.为了学习这种控制台应用程序的基础知识,C(不是C++)是最佳选择.本文将建立并实现一个简单的服务程序,其功能是查询系统 ...

随机推荐

  1. Hibernate自定查询返回list<?>

    /** * * @param session * :一个会话 * * @param hql * :是需要执行的hql语句, * * @param offset * 设置开始位置 * * @param ...

  2. Python - 字典(dict) 详解 及 代码

    字典(dict) 详解 及 代码 本文地址: http://blog.csdn.net/caroline_wendy/article/details/17291329 字典(dict)是表示映射的数据 ...

  3. Android关于ListView中item与控件抢夺焦点的那些事

    在开发中,listview可以说是我们使用最频繁的控件之一了,但是关于listview的各种问题也是很多.当我们使用自定义布局的Listview的时候,如果在item的布局文件里面存在Button或者 ...

  4. thinkphp 统计某个字段不重复数 总数

    $this->batch->count('DISTINCT intobatch');

  5. iozone文件系统测试 与EXCEL 制图

    http://www.iozone.org/[root@monitor bin]# ./iozone -a -s 512m -f /usr/test -y -q -Rb /root. -i -i Io ...

  6. Qt 学习之路:模型-视图高级技术

    PathView PathView是 QtQuick 中最强大的视图,同时也是最复杂的.PathView允许创建一种更灵活的视图.在这种视图中,数据项并不是方方正正,而是可以沿着任意路径布局.沿着同一 ...

  7. Java NIO 学习笔记

    为了防止无良网站的爬虫抓取文章,特此标识,转载请注明文章出处.LaplaceDemon/SJQ. http://www.cnblogs.com/shijiaqi1066/p/3344148.html ...

  8. web前端开发随手笔记 - 持续更新

    本文仅为个人常用代码整理,供自己日常查阅 html 浏览器内核 <!--[if IE]><![endif]--> <!--[if IE 6]><![endif ...

  9. (转)ecshop刷新页面出现power by ecshop和链接的解决办法

    当小伙伴在使用echop模板进行修改的时候,如果你删掉底部自带版权后,再调试程序刷新界面的时候,时不时就会冒出一个power by ecshop,而且是带有链接的,很不舒服,所以需要去掉,下面是最简单 ...

  10. Datum Form Goole Android

    1. <TurboChargeYourUI-How to make your AndroidUI fast and efficient> 2. <The World of List ...