博客
关于我
百度图表柱子背景颜色使用渐变效果
阅读量:132 次
发布时间:2019-02-26

本文共 2882 字,大约阅读时间需要 9 分钟。

??????

?????????????ECharts???????????????????????????????????????????????

???????????????????????ECharts????????????????????????????????????????????????????????????????

????

??????????

var app = echarts.init(document.getElementById("box"));  var option = {      title: {          text: '?????',          left: '50%'      },      tooltip: {          trigger: 'axis'      },      legend: {          type: 'plain',          data: ['2011?', '2012?', '2013?'],          bottom: '0px'      },      grid: {          left: '0%',          right: '4%',          bottom: '10%',          top: '15%',          containLabel: true      },      xAxis: {          type: 'value',          data: [2000, 3900, 8000],          onZero: false      },      yAxis: {          type: 'category',          data: [],          show: false      },      series: [          {              name: '2011?',              type: 'bar',              data: [2000],              itemStyle: {                  normal: {                      color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [                          { offset: 0, color: '#fff' },                          { offset: 1, color: '#B0B0B0' }                      ])                  }              },              barWidth: '20px',              label: {                  normal: {                      show: true,                      position: 'insideRight',                      color: '#333'                  }              }          },          {              name: '2012?',              type: 'bar',              data: [3900],              itemStyle: {                  normal: {                      color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [                          { offset: 0, color: '#fff' },                          { offset: 1, color: '#EF8945' }                      ])                  }              },              barWidth: '20px',              label: {                  normal: {                      show: true,                      position: 'insideRight',                      color: '#333'                  }              }          },          {              name: '2013?',              type: 'bar',              data: [8000],              itemStyle: {                  normal: {                      color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [                          { offset: 0, color: '#fff' },                          { offset: 1, color: '#6EA6DA' }                      ])                  }              },              barWidth: '20px',              label: {                  normal: {                      show: true,                      position: 'insideRight',                      color: '#333'                  }              }          }      ]  };  app.setOption(option);

????????????????????????????????????????????????????????ECharts?????????????????????????????????????????????????????

转载地址:http://iovf.baihongyu.com/

你可能感兴趣的文章
Postgresql中的表结构和数据同步/数据传输到Mysql
查看>>
Postgresql中自增主键序列的使用以及数据传输时提示:错误:关系“xxx_xx_xx_seq“不存在
查看>>
postgreSQL入门命令
查看>>
PostgreSQL删除数据库报"ERROR: There is 1 other session using the database."
查看>>
PostgreSQL和Oracle两种数据库有啥区别?如何选择?
查看>>
PostgreSQL学习总结(11)—— PostgreSQL 常用的高可用集群方案
查看>>
PostgreSQL学习总结(1)—— PostgreSQL 入门简介与安装
查看>>
PostgreSQL学习总结(2)—— PostgreSQL 语法
查看>>
PostgreSQL学习总结(3)—— PostgreSQL 数据类型
查看>>
PostgreSQL学习总结(6)—— PostgreSQL 模式(SCHEMA)详解
查看>>
PostgreSQL学习总结(7)—— PostgreSQL 语句 INSERT INTO、SELECT、UPDATE、DELETE 等学习
查看>>
PostgreSQL学习总结(8)—— PostgreSQL 基于数据库和基于模式(schema)的多租户分析
查看>>
PostgreSQL学习总结(9)—— PostgreSQL 运算符与表达式
查看>>
PostGreSql学习笔记001---PostgreSQL10.4安装(Windows)_支持PostGreGis_PostJDBC
查看>>
PostGreSql学习笔记002---Navicat Premium中管理PostGreSql 错误:字段rolcatupdate 不存在
查看>>
PostgreSQL学习笔记:PostgreSQL vs MySQL
查看>>
PostgreSQL实现shape数据转geojson数据(地图工具篇.18)
查看>>
PostgreSQL导入shape数据(地图工具篇.10)
查看>>
PostGreSql工作笔记003---在Navicat中创建数据库时报错rolcatupdate不存在_具体原因看其他博文_这里使用pgAdmin4创建管理postgre
查看>>
PostGreSql工作笔记004---PostGreSql修改密码_windows和linux下修改
查看>>