引入echarts.min.js或者使用CDN https://cdn.bootcss.com/echarts/4.2.1-rc1/echarts.min.js

为ECharts准备一个具备大小（宽高）的DOM

<div id="main" style="width:600px;height:400px;"></div>

Demo1：柱形图

<!DOCTYPE html><html>

<head>

<meta charset="utf-8">

<!-- 引入 ECharts 文件 -->

<script src="echarts.min.js">

</script>

</head>

<body>

<!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->

<div id="main" style="width: 600px;height:400px;"></div></body>

<script type="text/javascript">

// 基于准备好的dom，初始化echarts实例

var myChart = echarts.init(document.getElementById('main'));

// 指定图表的配置项和数据

var option = {

    title: {

        text: 'ECharts 入门示例'

    },

tooltip: {},  //提示框组件

legend: {

    data:['销量']

},

xAxis: {

    data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]

},

yAxis: {},

series: [{

    name: '销量',

    type: 'bar',

    data: [5, 20, 36, 10, 10, 20]

}]

};

// 使用刚指定的配置项和数据显示图表。

myChart.setOption(option);

</script>

</body>

</html>

　　

EChars学习之路1的更多相关文章

  1. jQuery学习之路（1）-选择器

    ▓▓▓▓▓▓ 大致介绍 终于开始了我的jQuery学习之路!感觉不能再拖了,要边学习原生JavaScript边学习jQuery jQuery是什么? jQuery是一个快速.简洁的JavaScript ...

  2. Android开发学习之路-RecyclerView滑动删除和拖动排序

    Android开发学习之路-RecyclerView使用初探 Android开发学习之路-RecyclerView的Item自定义动画及DefaultItemAnimator源码分析 Android开 ...

  3. RPC远程过程调用学习之路（一）：用最原始代码还原PRC框架

    RPC: Remote Procedure Call 远程过程调用,即业务的具体实现不是在自己系统中,需要从其他系统中进行调用实现,所以在系统间进行数据交互时经常使用. rpc的实现方式有很多,可以通 ...

  4. webService学习之路（三）：springMVC集成CXF后调用已知的wsdl接口

    webService学习之路一:讲解了通过传统方式怎么发布及调用webservice webService学习之路二:讲解了SpringMVC和CXF的集成及快速发布webservice 本篇文章将讲 ...

  5. [精品书单] C#/.NET 学习之路——从入门到放弃

    C#/.NET 学习之路--从入门到放弃 此系列只包含 C#/CLR 学习,不包含应用框架(ASP.NET , WPF , WCF 等)及架构设计学习书籍和资料. C# 入门 <C# 本质论&g ...

  6. Redis——学习之路四（初识主从配置）

    首先我们配置一台master服务器,两台slave服务器.master服务器配置就是默认配置 端口为6379,添加就一个密码CeshiPassword,然后启动master服务器. 两台slave服务 ...

  7. Redis——学习之路三（初识redis config配置）

    我们先看看config 默认情况下系统是怎么配置的.在命令行中输入 config get *(如图) 默认情况下有61配置信息,每一个命令占两行,第一行为配置名称信息,第二行为配置的具体信息.     ...

  8. Redis——学习之路二（初识redis服务器命令）

    上一章我们已经知道了如果启动redis服务器,现在我们来学习一下,以及如何用客户端连接服务器.接下来我们来学习一下查看操作服务器的命令. 服务器命令: 1.info——当前redis服务器信息   s ...

  9. 踏上Salesforce的学习之路（一）

    相信通过前面的学习,大家已经拥有了一个属于自己的Salesforce开发者账号,下面,我们将用这个账号正式踏上Salesforce的学习之路. 首先,点击网址:https://developer.sa ...

随机推荐

  1. python算法-选择排序

    核心算法:固定位置,选择元素,即:先从序列中,找到最小的元素,放在第一个位置,之后找到第二小的元素,放在第二个元素,以此类推,就可以完成整个排序工作了. 代码示例如下: x=[6,3,2,7,4,9, ...

  2. Understanding ROS Services and Parameters

    service是nodes之间通信的一种方式,允许nodes send a request and recieve a response. rosservice rosparam roservice ...

  3. java8 Stream操作

    Stream操作详解:https://www.ibm.com/developerworks/cn/java/j-lo-java8streamapi/#icomments

  4. PostGIS计算矢量切片(一)--渲染数据

        没写错,是使用postgis计算出来矢量切片.在这之前先准备一个数据:一个GIS数据表(本例中数据为一百万的点数据,坐标:4326),并在表中添加x,y字段,方便后面的数据筛选.sql中用到了 ...

  5. 35.Odoo产品分析 (四) – 工具板块(6) – 午餐管理(1)

    查看Odoo产品分析系列--目录 很多公司为都会为员工提供午餐.然而,公司内部的午餐需要适当的管理,特别是在员工或供应商数量非常重要的时候."午餐订单"模块的开发,使管理更容易,也 ...

  6. gitbook 入门教程之发布电子书

    输出目标文件 语法格式: gitbook build [book] [output] 默认情况下,gitbook 输出方式是静态网站,其实 gitbook 的输出方式有三种: website, jso ...

  7. 搭建一个dubbo+zookeeper平台

    本篇主要是来分享从头开始搭建一个dubbo+zookeeper平台的过程,其中会简要介绍下dubbo服务的作用. 首先,看下一般网站架构随着业务的发展,逻辑越来越复杂,数据量越来越大,交互越来越多之后 ...

  8. 面相服务的架构SOA

    SOA体系结构是基于服务组件模型,将应用程序的不同功能单元通过定义良好的接口契约联系起来,接口是采用中立方式进行定义的,独立于实现服务的硬件平台,操作系统和编程语言.使得构建在这样的系统中的服务可以以 ...

  9. 拉勾网爬取全国python职位并数据分析薪资，工作经验，学历等信息

    首先前往拉勾网“爬虫”职位相关页面 确定网页的加载方式是JavaScript加载 通过谷歌浏览器开发者工具分析和寻找网页的真实请求,确定真实数据在position.Ajax开头的链接里,请求方式是PO ...

  10. 调试工具gdb

    1.1 gdb符号调试器简介 gdb是一个用来调试C和C++程序的功能强大的调试器,它能在程序运行时观察程序的内部结构和内存的使用情况. gdb主要提供以下几种功能: 监视程序中变量值的变化 设置断点 ...