1.引入完整版echarts.min.js.

2.为ECharts准备一个具备大小(宽高)的Dom .

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

3.script下面基于准备好的dom,初始化echarts实例.

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

4.复制所需要格式echarts的图表option粘贴.  url: http://www.echartsjs.com/examples/

 // 指定图表的配置项和数据
var option = {
title: {
text: 'ECharts 入门示例'
},
tooltip: {},
legend: {
data:['销量']
},
xAxis: {
data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
},
yAxis: {},
series: [{
name: '销量',
type: 'bar',
data: [, , , , , ]
}]
};

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

myChart.setOption(option);

echarts使用方法的更多相关文章

  1. js调用echarts getImage方法 将图表转换为img

    function chart(opt,id,chartName){//配置option的方法 var chartName = echarts.init(document.getElementById( ...

  2. ECharts学习总结(二):标签式单文件引入echarts的方法

    下载好echarts的库文件.然后在script里面引入. //from echarts example <body> <div id="main" style= ...

  3. echarts 自适应方法 x和y x2和y2

    grid:{ x:65, y:20, x2:30, y2:30},

  4. Echarts 曲线数少于图例数解决方法

    在上一篇文章 Echarts 多曲线“断点”问题解决方法 中说到了Angular 项目中要使用 Echarts 的方法. 说明了自己解决当“每一条曲线的横坐标不相同”时,在各条曲线上,它们的值采用数组 ...

  5. echarts+php+mysql 绘图实例

    最近在学习php+mysql,因为之前画图表都是直接在echart的实例demo中修改数据,便想着两相结合练习一下,通过ajax调用后台数据画图表. 我使用的是echart3,相比较第二版,echar ...

  6. Ionic2系列——在Ionic2中使用ECharts

    在群里看到有人问怎么在Ionic2中集成ECharts来显示图表.当时答应说写个blog,简单写下步骤. 在TypeScript中如果要使用第三方库,必须要有d.ts,也就是定义文件,没有这个文件的话 ...

  7. echarts学习总结

    ECharts学习总结使用步骤1 引入ECharts <script src="echarts.min.js"></script>2 绘制一个简单的图表 为 ...

  8. 【WEB前端】使用百度ECharts,绘制项目质量报表

    一.下载ECharts的js库 下载地址:http://echarts.baidu.com/download.html 由于我们对体积无要求,所以我们采用了完整版本,功能齐全,在项目中,我们只需要像普 ...

  9. 5 分钟上手 ECharts

    获取 ECharts 你可以通过以下几种方式获取 ECharts. 从官网下载界面选择你需要的版本下载,根据开发者功能和体积上的需求,我们提供了不同打包的下载,如果你在体积上没有要求,可以直接下载完整 ...

随机推荐

  1. shrio的知识储备

    博客讲解; shrio的知识储备 shrio的简单认识 笔记整理地址: Shrio.pdf 下载 Shrio理论.doc 下载 Shrio知识储备.doc  下载 Shrio的知识储备 (一)   S ...

  2. mac下 IDEA 的pom下 出现 Cannot access in offline mode 问题

    在mac下 配置完maven后发现总是不能引入最新的jar包,google了好久总算找到解决办法: 默认带有work offline ,不清楚这个是干嘛用的.勾选掉 了就行了.

  3. EXCHANGE 2013 队列

    每当咱在Exchange里查看队列的时候,我们会看到队列分成好几个组,每个邮箱数据库都有自己的目标队列,DAG.AD站点也是,AD林也是一个队列,最后最多的就是外部SMTP域队列. 当传输服务处理队列 ...

  4. Azure 负载均衡器的多个 VIP

    您现在访问的是微软AZURE全球版技术文档网站,若需要访问由世纪互联运营的MICROSOFT AZURE中国区技术文档网站,请访问 https://docs.azure.cn. Azure 负载均衡器 ...

  5. 通过163smtp服务器向各大邮箱发送邮件(SOCKET编程)

    package server; import java.io.*; import java.net.*; import java.sql.Time; import java.util.Scanner; ...

  6. python新建以时间命名的目录

    1.新建三级目录,第一级是去年的年份,第二级是去年的月,第三级为去年的日,在日的文件中写入今年的时分秒 import os import time import shutil def create_f ...

  7. IntelliJ IDEA 下载和激活

    IntelliJ IDEA 下载地址: https://www.jetbrains.com/idea/download/#section=windows 激活码获取地址:http://idea.lan ...

  8. luogu P1272 重建道路

    嘟嘟嘟 这好像是一种树上背包. 我们令dp[i][j] 表示在 i 所在的子树中(包括节点 i)分离出一个大小为 j 的子树最少需割多少条边. 那么转移方程就是 dp[u][j] = min(dp[u ...

  9. .net中使用mysql回滚和sqlserver回滚的区别

    关于sqlserver事务和mysql事务 首先这是一种方法 public static int GetExecteQuery()        {            SqlConnection ...

  10. python之九九乘法表

    for i in range(1,10): print( ) for j in range(1,i+1): print('%d*%d=%d '%(i,j,i*j),end="") ...