echarts功能配置实例----柱/折线、饼图
---恢复内容开始---
echarts中的柱状图和折线图的参数配置可以共用，一般只需要修改图表类型这一个参数即可。
一、echarts最简单的实例
1、折线图/柱状图
<html>
<head>
<script src="resource/jquery-3.3.1.min.js"></script>
<script src="resource/echarts.js"></script>
<script type="text/javascript">
$(document).ready(function(){
//创建存放图表的echar
var chart = echarts.init($('#echartsLineDemo')[]);
//echars的参数配置项
option = {
xAxis: {
//坐标轴类型，大致可分类目轴category，x轴；数值轴value，y轴；
type: 'category',
//坐标轴名称数组
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
yAxis: {
type: 'value'
},
series: [{
//需要显示的数据
data: [, , , , , , ],
//图表类型：line是折线、bar是柱状图、pei是饼图。
type: 'line'
}]
};
//添加option
chart.setOption(option);
}); </script>
</head>
<body>
<div id="echartsLineDemo" style="height: 500px;width: 800px;" > </div> </body>
</html>
补充：折线图和柱图图的配置类似，只需把图表类型修改成bar即可。
2、饼图
只需要更改option的配置即可。
option = {
title : {
text: '某站点用户访问来源',
x:'center'
},
series : [
{
name: '访问来源',
type: 'pie',
radius : '55%',
center: ['50%', '60%'],
data:[
{value:335, name:'直接访问'},
{value:310, name:'邮件营销'},
{value:234, name:'联盟广告'},
{value:135, name:'视频广告'},
{value:1548, name:'搜索引擎'}
],
}
]
};
echarts功能配置实例----柱/折线、饼图的更多相关文章
- Keepalived 配置实例
Keepalived 是一款轻量级HA集群应用,它的设计初衷是为了做LVS集群的HA,即探测LVS健康情况,从而进行主备切换,不仅如此,还能够探测LVS代理的后端主机的健康状况,动态修改LVS转发规则 ...
- linux邮件服务器postfix配置实例
linux邮件服务器postfix配置实例(超级详细!!!) 2013-03-13 13:30:21 标签:邮件服务器 linux 1. 系统安装:1)centos4.3 选上MAIL组件里的全部.2 ...
- OGG学习笔记02-单向复制配置实例
OGG学习笔记02-单向复制配置实例 实验环境: 源端:192.168.1.30,Oracle 10.2.0.5 单实例 目标端:192.168.1.31,Oracle 10.2.0.5 单实例 1. ...
- IPSEC VPN配置实例
TL-R400VPN应用——IPSEC VPN配置实例 TL-ER6120是TP-LINK专为企业应用而开发的VPN路由器,具备强大的数据处理能力,并且支持丰富的软件功能,包括VPN.IP/MAC 地 ...
- Nginx常用配置实例（4）
Nginx作为一个HTTP服务器,在功能实现方面和性能方面都表现得非常卓越,完全可以与Apache相媲美,几乎可以实现Apache的所有功能,下面就介绍一些Nginx常用的配置实例,具体包含虚拟主机配 ...
- springMVC注解方式+easyUI+MYSQL配置实例
刚接触springMVC,使用的注解方式,也在学习阶段,所以把自己学习到的记下来.本文利用springMVC从数据库读取用户信息为例,分享一下. 1.准备相关架包及资源.因为使用springMVC+e ...
- Tomcat配置实例
转自:https://www.cnblogs.com/kismetv/p/7228274.html 目录 一.一个server.xml配置实例 二.server.xml文档的元素分类和整体结构 1.整 ...
- Keepalived详解（三）：Keepalived基础功能应用实例【转】
Keepalived基础功能应用实例: 1.Keepalived基础HA功能演示: 在默认情况下,Keepalived可以实现对系统死机.网络异常及Keepalived本身进行监控,也就是说当系统出现 ...
- MySQL主从备份配置实例
转载自:https://www.cnblogs.com/ahaii/p/6307648.html MySQL主从备份配置实例 场景: 1.主服务器192.168.0.225.从服务器192.168.0 ...
随机推荐
- 【ABP杂烩】Extensions后缀扩展方法
1.Extensions介绍 扩展方法使你能够向现有类型“添加”方法,而无需创建新的派生类型.重新编译或以其他方式修改原始类型. 扩展方法是一种特殊的静态方法,但可以像扩展类型上的实例方法一样进行调用 ...
- ML - 特征选择
1. 决策树中的特征选择 分类决策树是一种描述对实例进行分类的树型结构,决策树学习本质上就是从训练数据集中归纳出一组分类规则,而二叉决策树类似于if-else规则.决策树的构建也是非常的简单,首先依据 ...
- rest-framework之APIView 序列化组件
rest-framework之APIView 一 安装djangorestframework 方式一:pip3 install djangorestframework 方式二:pycharm图形化界面 ...
- mysql 开发进阶篇系列 6 锁问题(事务与隔离级别介绍)
一.概述 在数据库中,数据是属于共享资源,为了保证并发访问的一致性,有效性,产生了锁.接下来重点讨论mysql锁机制的特点,常见的锁问题,以及解决mysql锁问题的一些方法或建议. 相比其他数据库,m ...
- com.javax.servlet 慢慢看完慢慢学完
1.接口 RequestDispatcher 类说明 定义一个对象,从客户端接收请求,然后将它发给服务器的可用资源 (例如Servlet.CGI.HTML文件.JSP文件).Servlet引擎创 建r ...
- 基于redis的分布式锁实现
1.分布式锁介绍 在计算机系统中,锁作为一种控制并发的机制无处不在. 单机环境下,操作系统能够在进程或线程之间通过本地的锁来控制并发程序的行为.而在如今的大型复杂系统中,通常采用的是分布式架构提供服务 ...
- 【原创】使用golang访问windows telnet服务器
本篇博客记录本次使用golang语言tcp方式进行telnet服务器访问 环境: 1.win7系统telnet服务器,使用地址:192.168.8.189 2.python使用telnetlib库对t ...
- Perl的do语句块结构
do语句块结构如下: do {...} do语句块像是匿名子程序一样,没有名称,给定一个语句块,直接执行.且和子程序一样,do语句块的返回值都是最后一个执行的语句的返回值. 例如,将使用if-elsi ...
- mybatis-generator插件执行报错：Cannot resolve classpath entry
记录一个小问题 使用了mybatis-generator插件自动生成实体类,DAO,Mapper,在执行时报错.报错信息如下 Failed to execute goal org.mybatis.ge ...
- iOS Runtime的消息转发机制
前面我们已经讲解Runtime的基本概念和基本使用,如果大家对Runtime机制不是很了解,可以先看一下以前的博客,会对理解这篇博客有所帮助!!! Runtime基本概念:https://www.cn ...