Echarts学习笔记（三）（echart各个常见配置项详解）

Echarts各个常见配置项详解
即.setoption{....}中各项内容的解释

title：标题组件，包含主标题和副标题。
title{
  id：string，组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。
  show:Boolean，是否显示标题组件。
  text:string，主标题文本，支持使用 \n 换行。
  link:string，主标题文本超链接。
  target:string，指定窗口打开主标题超链接。“self”当前窗口打开；“blank”新窗口打开。
  textStyle:{}//主标题的字体等样式。
  zlevel:number，default:0。所有图形的 zlevel 值。zlevel用于 Canvas 分层，不同zlevel值的图形会放置在不同的

             Canvas 中, Canvas 分层是一种常见的优化手段。我们可以把一些图形变化频繁（例如有动画）的组件设置

             成一个单独的zlevel。

            zlevel 大的 Canvas 会放在 zlevel 小的 Canvas 的上面。
  z：number，default：2。组件的所有图形的z值。控制图形的前后顺序。z值小的图形会被z值大的图形覆盖。z相比zlevel优先           级更低，而且不会创建新的 Canvas。

legend：组件图例组件展现了不同系列的标记(symbol)，颜色和名字。可以通过点击图例控制哪些系列不显示。
legend:{
  type:string，图例的类型。"plain" 普通图例。缺省就是普通图例；"scroll" 可滚动翻页的图例。当图例数量较多时可以使用。
  id:string，组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。
  show:Boolean， default：true。所有图形的 zlevel 值。
  zlevel:number，default:0。
  z:number，default：2。组件的所有图形的z值。控制图形的前后顺序。
  left:string/number，图例组件离容器左侧的距离。left 的值可以是像 20 这样的具体像素值，可以是像 '20%' 这样相对于容器高            宽的百分比，也可以是 'left', 'center', 'right'。
  right：string/number，
  top:string/number，
  bottom:string/number，
  width/height:string/number，图例组件的宽/高度。默认自适应。
  orient：string，default: 'horizontal'，图例列表的布局朝向。
}

grid：直角坐标系内绘图网格，单个 grid 内最多可以放置上下两个 X 轴，左右两个 Y 轴。可以在网格上绘制折线图，柱状图，              散点图（气泡图）。
grid:{
  id:string，组件 ID。默认不指定。指定则可用于在 option 或者 API 中引用组件。
  show:
  zlevel:
  z:
  left/right/top/bottom:
  width/height:
  containLabel:Boolean， default: false。grid 区域是否包含坐标轴的刻度标签。
                      containLabel 为 false 的时候：
                            grid.left， grid.right ，grid.top ，grid.bottom， grid.width ，grid.height 决定的是由坐标轴形成的矩形的尺寸和                              位置。
                            这比较适用于多个 grid 进行对齐的场景，因为往往多个 grid 对齐的时候，是依据坐标轴来对齐的。
                     containLabel 为 true 的时候：
                           grid.left， grid.right， grid.top ，grid.bottom， grid.width， grid.height ，决定的是包括了坐标轴标签在内的所                              有内容所形成的矩形的位置。
                           这常用于『防止标签溢出』的场景，标签溢出指的是，标签长度动态变化时，可能会溢出容器或者覆盖其他组                              件。
  backgroundColor:Color,default: 'transparent' 。网格背景色，默认透明。此配置项生效的前提是，设置了 show: true。
                            颜色可以使用 RGB 表示，比如 'rgb(128, 128, 128)' ，如果想要加上 alpha 通道，可以使用 RGBA，比如                                       'rgba(128, 128, 128, 0.5)'，也可以使用十六进制格式，比如 '#ccc'
  borderColor：
  borderWidth：这两项生效的前提是show: true。
}

xAxis：直角坐标系 grid 中的 x 轴，一般情况下单个 grid 组件最多只能放上下两个 x 轴，多于两个 x 轴需要通过配置 offset 属性          防止同个位置多个 x 轴的重叠。
xAxis:{
  id:
  show:Boolean，是否显示 x 轴。
  gridIndex:number，default: 0 。x 轴所在的 grid 的索引，默认位于第一个 grid。
  position:string，x 轴的位置。
  offset:number，default: 0 。X 轴相对于默认位置的偏移，在相同的 position 上有多个 X 轴的时候有用。
  type:string，default: 'category'。坐标轴类型。
         'value' 数值轴，适用于连续数据。
        'category' 类目轴，适用于离散的类目数据，为该类型时必须通过 data 设置类目数据。
        'time' 时间轴，适用于连续的时序数据，与数值轴相比时间轴带有时间的格式化，在刻度计算上也有所不同，例如会根据跨                  度的范围来决定使用月，星期，日还是小时范围的刻度。
        'log' 对数轴。适用于对数数据。
  name:string，坐标轴名称。
  nameLocation:string，default: 'end'。坐标轴名称显示位置。可选值'start'，'middle' 或者 'center'，'end'。
  data[i]：Object，类目数据，在类目轴（type: 'category'）中有效。
}