博客
关于我
百度图表柱子背景颜色使用渐变效果
阅读量: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/

你可能感兴趣的文章
openlayers 入门教程(十四):第三方插件
查看>>
openlayers 入门教程(四):layers 篇
查看>>
OpenLayers 项目分析(三)-OpenLayers中定制JavaScript内置类
查看>>
Openlayers下载与加载geoserver的wms服务显示地图
查看>>
Openlayers中使用Cluster+Overlay实现点击单个要素和聚合要素时显示不同弹窗
查看>>
Openlayers中使用Cluster实现点位元素重合时动态聚合与取消聚合
查看>>
Openlayers中使用Cluster实现缩放地图时图层聚合与取消聚合
查看>>
Openlayers中使用Image的rotation实现车辆定位导航带转角(判断车辆图片旋转角度)
查看>>
Openlayers中加载Geoserver切割的EPSG:900913离线瓦片图层组
查看>>
Openlayers中多图层遮挡时调整图层上下顺序
查看>>
Openlayers中将某个feature置于最上层
查看>>
Openlayers中点击地图获取坐标并输出
查看>>
Openlayers中设置定时绘制和清理直线图层
查看>>
Openlayers图文版实战,vue项目从0到1做基础配置
查看>>
Openlayers实战:modifystart、modifyend互动示例
查看>>
Openlayers实战:判断共享单车是否在电子围栏内
查看>>
Openlayers实战:加载Bing地图
查看>>
Openlayers实战:绘制图形,导出geojson文件
查看>>
Openlayers实战:绘制图形,导出KML文件
查看>>
Openlayers实战:绘制多边形,导出CSV文件
查看>>