echarts 金字塔
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="main" style="width: 600px;height:400px;"></div>
<script src="http://echarts.baidu.com/dist/echarts.min.js"></script>
<script>
var data = [[15, 0], [-50, 10], [-56.5, 20], [-46.5, 30], [-22.1, 40]]; var myChart = echarts.init(document.getElementById('main')); myChart.setOption({
tooltip : {
trigger: 'axis',
axisPointer : { // 坐标轴指示器，坐标轴触发有效
type : 'shadow' // 默认为直线，可选为：'line' | 'shadow'
}
},
legend: {
data:['支出', '收入']
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis : [
{
type : 'value',
axisLabel:{
formatter:function(value) {
return Math.abs(value);
}
}
}
],
yAxis : [
{
type : 'category',
axisTick : {show: false},
data : ['周一','周二','周三','周四','周五','周六','周日']
}
],
series : [
{
name:'收入',
type:'bar',
stack: '总量',
data:[320, 302, 341, 374, 390, 450, 420]
},
{
name:'支出',
type:'bar',
stack: '总量',
data:[-120, -132, -101, -134, -190, -230, -210]
}
]
});
</script>
</body>
</html>
echarts 金字塔的更多相关文章
- echarts 应用数个样例
应用一:环形图和饼图嵌套 先说明一下内部文件分布: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdGV4dGJveQ==/font/5a6L5L2T/fo ...
- R语言学习笔记︱Echarts与R的可视化包——地区地图
笔者寄语:感谢CDA DSC训练营周末上完课,常老师.曾柯老师加了小课,讲了echart与R结合的函数包recharts的一些基本用法.通过对比谢益辉老师GitHub的说明文档,曾柯老师极大地简化了一 ...
- ECharts学习总结（二）-----图表组件漏斗图(funnel)
今天在学习ECharts时,想要在ECharts图表的原生态Demo中抠出漏斗图,却不知如何下手,经过一番研究,特总结如下: 首先我们需要这样做 1.拷贝出两个js文件:esl.js 和echarts ...
- 一起来玩echarts系列（一）------箱线图的分析与绘制
一.箱线图 Box-plot 箱线图一般被用作显示数据分散情况.具体是计算一组数据的中位数.25%分位数.75%分位数.上边界.下边界,来将数据从大到小排列,直观展示数据整体的分布情况. 大部分正常数 ...
- Webstorm+Webpack+echarts构建个性化定制的数据可视化图表&&两个echarts详细教程（柱状图，南丁格尔图）
Webstorm+Webpack+echarts ECharts 特性介绍 ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(I ...
- ASP.NET MVC5+EF6+EasyUI 后台管理系统（67）-MVC与ECharts
系列目录 ECharts 特性介绍 ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Fire ...
- echarts+php+mysql 绘图实例
最近在学习php+mysql,因为之前画图表都是直接在echart的实例demo中修改数据,便想着两相结合练习一下,通过ajax调用后台数据画图表. 我使用的是echart3,相比较第二版,echar ...
- 数据图表插件Echarts（一）
一.引言 最近做一个智慧城市项目,项目中需要图表和报表进行数据分析,从网上找了很多,最后找到了百度开放的echarts,一个很强大的插件. 二.介绍 ECharts,缩写来自Enterprise Ch ...
- Atitit.软件开发的三层结构isv金字塔模型
Atitit.软件开发的三层结构isv金字塔模型 第一层,Implements 层,着重与功能的实现.. 第二次,spec层,理论层,设计规范,接口,等.流程.方法论 顶层,val层,价值观层,原则, ...
随机推荐
- python处理excel总结
工作中,大家经常会使用excel去处理数据以及展示,但是对于部分工作我们可以借助程序帮忙实现,达到高效解决问题的效果,比如将接口返回的json解析并保存结果到excel中,按一定规律处理excel中的 ...
- hibernate简介以及简单配置
Hibernate简介: Hibernate是一个开源对象关联关系映射的框架,他对JDBC做了轻量级的封装,使我们可以通过面向对象的思想操作数据库. 为什么要用Hibernate: 1: 对JDBC访 ...
- Python基础——类
创建类 class people: '帮助信息:dsafdaf' #所有实例都会共享的 number=100 #构造函数,初始化的方法,当创建一个类的时候,首先会调用它 def __init__(se ...
- 谈谈你对Hibernate的理解
答: 1. 面向对象设计的软件内部运行过程可以理解成就是在不断创建各种新对象.建立对象之间的关系,调用对象的方法来改变各个对象的状态和对象消亡的过程,不管程序运行的过程和操作怎么样,本质上都是要得到一 ...
- 「新手必看」Python+Opencv实现摄像头调用RGB图像并转换成HSV模型
在ROS机器人的应用开发中,调用摄像头进行机器视觉处理是比较常见的方法,现在把利用opencv和python语言实现摄像头调用并转换成HSV模型的方法分享出来,希望能对学习ROS机器人的新手们一点帮助 ...
- Solr 中的 docValues=true
前言: 在Lucene4.x之后,出现一个重大的特性,就是索引支持DocValues,这对于广大的solr和elasticsearch用户,无疑来说是一个福音,这玩意的出现通过牺牲一定的磁盘空间带来 ...
- ubuntu12.04ppa安装emacs24
ppa地址:https://launchpad.net/~cassou/+archive/emacs 因为debian版本的emacs-snapshot维护者停止更新,所有ubuntu上的也停止了. ...
- Java-创建一个线程
第一种继承Thread类 package com.tj; public class BasicThread1 extends Thread { public void run() { System.o ...
- hibernate源码分析1-保存一个对象
要点 用了event的方式贯穿CRUD的过程 值得学习 用dynamic-insert 支持 插入时 可选 全字段插入 还是仅仅有值的字段插入. 返回主键的值 用了 Serializable 类型作为 ...
- RF操作滚动条（竖拉）
方式一:window.scrollBy(0, document.body.scrollHeight) 方式二:window.scrollTo(0, document.body.scrollHeight ...