legend

2017-09-29  本文已影响0人  言之凡
图例

type: 'plain' / 'scroll' //默认图例
orient:'horizontal' / 'vertical' //图例朝向
align:
padding:
animation:图例翻页是否使用动画
animationDurationUpdate:翻页动画时长
itemGap://图例每项的间距
itemWidth:
itemHeight:
formatter:

// 使用字符串模板,模板变量为图例名称 {name}
formatter: 'Legend {name}'

// 使用回调函数
formatter: function (name) {
return 'Legend ' + name;
}

scrollDataIndex:0
pageButtonItemGap:5
pageButtonGap: //图例控制箭头和图例之间的间距
pageButtonPosition:'start' / 'end'
pageFormatter:

  {1}/{3}     //**页数和总页数** (默认页数)
  {
    current: number
    total: number
  }  //**函数返回字符串**

pageIcons://图标控制块的图标

 {          
   horizontal:数组 [previous page button, next page button]
              默认 ['M0,0L12,-10L12,10z', 'M0,0L-12,-10L-12,10z']
              自定义['image://url','path://']
    vertical:数组 [previous page button, next page button]
 }

pageIconColor: // 翻页按钮的颜色
pageIconInactiveColor: //按钮失效的颜色
pageIconSize:3 / [宽,高 ] //翻页按钮的大小
pageTextStyle://图例文字样式

{
  color:
  fontStyle:normal/italic/oblique
  fontWeight:
  fontFamliy: 'serif' , 'monospace', 'Arial', 'Courier New', 'Microsoft 
  fontSize:
  lineHeight:
  width:
  height:
  textBorderColor:
  textBorderWidth:
  textShadowColor:
  textShadowBlur://**文字本身阴影长度**
  textShadowOffsetX
}

selectedMode:true //设置是否可以点击显示系列图
selected:{ '系列1':true,'系列2':false}//图例选中状态表
tooltip:

{
  show:true // ** 提示框浮层和axisPointer **
  trigger:'item' / 'axis' / 'none'
  triggerOn: 'mousemove' / 'click' / 'mousemove|click' / 'none'   //触发条件
  enterable:false  //**鼠标是否可进入提示框浮层中,如需添加链接,按钮,可设置为 true。**
  position:
        - 鼠标在左侧时 tooltip 显示到右侧,鼠标在右侧时 tooltip 显示到左侧。
            function (pos, params, dom, rect, size) {
                   var obj = {top: 60};
                   obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 5;
                    return obj;
            }
        - 绝对位置,相对于容器左侧 10px, 上侧 10 px
              [10, 10]
        - 相对位置,放置在容器正中间
              ['50%', '50%']
  confine:false //**图表外层的 dom 被设置为 'overflow: hidden'**
  axisPointer: {
             type:'line' /'shadow' / ' cross'
             axis:'x', 'y', 'radius', 'angle' //坐标轴选择哪个轴axisPointer
             snap: // 坐标指示器是否自动吸附到点上
             label: //文本标签
             lineStyle:               
  formatter:
            '{b0}: {c0}<br />{b1}: {c1}'
            回调函数:(params: Object|Array, ticket: string, callback: (ticket: string, html: string)) => string
 extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'//附加到浮层的样式
}

1.折线(区域)图、柱状(条形)图、K线图 :
{a}(系列名称),{b}(类目值),{c}(数值), {d}(无)
2.散点图(气泡)图 :
{a}(系列名称),{b}(数据名称),{c}(数值数组), {d}(无)
3.地图 :
{a}(系列名称),{b}(区域名称),{c}(合并数值), {d}(无)
4.饼图、仪表盘、漏斗图:
{a}(系列名称),{b}(数据项名称),{c}(数值), {d}(百分比)

上一篇下一篇

猜你喜欢

热点阅读