title: {//图表标题

    x: 'left', //组件离容器左侧的距离,left的值可以是像20,这样的具体像素值,
          可以是像 '20%' 这样相对于容器高宽的百分比,也可以是 'left''center''right'                   
    y: 'top',// grid 组件离容器上侧的距离,可以使像素值,也可以为百分比,可选为:'top' ¦ 'bottom' ¦ 'center'
    borderColor: '#ccc',// 标题边框颜色
    borderWidth: 0,// 标题的边框线宽,默认为0
    padding: 5,// 标题内边距,单位px,默认各方向内边距为5,
     borderRadius,//圆角半径,单位px,支持传入数组分别指定4 个圆角半径,  
           borderRadius: [5, 5, 0, 0] //(顺时针左上,右上,右下,左下)  
           borderRadius: 5, // 统一设置四个角的圆角大小
 
    itemGap: 10,// 主副标题纵向间隔,单位px,默认为10,
    textStyle: {
        fontSize: 18,//主标题文字的字体大小
        fontWeight: 'bolder',//主标题文字字体的粗细,可以是'normal','bold','bolder','lighter'
        color: '#333'// 主标题文字颜色
        align:"left"//  文字水平对齐方式,默认自动
    },
    subtextStyle: {//副标题相关属性设置
        color: '#ccc',// 副标题文字颜色
        fontSize:18 , //副标题文字的字体大小
    }
},
 
xAxis:{//直角坐标系 grid 中的 x 轴
    type:"category" ,//坐标轴类型。
    name:"天", //坐标轴名称。k可选:value、category、time、log(对数轴)
    nameLocation: 'end' , //坐标轴名称的文字样式。可选为:start、middle、center、end
     nameTextStyle:{//坐标轴名称的文字样式。
       color:"#ccc",  //坐标轴名称的颜色,默认取 axisLine.lineStyle.color
      verticalAlign:"top", //文字垂直对齐方式,默认自动。可选为:top、middle、bottom
    

    backgroundColor: {//文字块背景色。可以是直接的颜色值,可以支持使用图片,例如:
     image: 'xxx/xxx.png'
     // 这里可以是图片的 URL,
     // 或者图片的 dataURI,
     // 或者 HTMLImageElement 对象,
     // 或者 HTMLCanvasElement 对象。
  },
  borderWidth:"0",//文字块边框宽度。,默认为哦
  shadowColor: 'transparent' ,文字块的背景阴影颜色。[ default: 'transparent' ]
   axisLine:{//坐标轴轴线相关设置。
     show:false, //是否显示坐标轴轴线,默认为为true 
     color:"#ccc" //x或y轴轴线的颜色
    },
  splitLine:{//坐标轴网格线
    show:false//分割线是否显示,默认为true
    lineStyle:{
        color:"#fff" //分隔线颜色,可以设置成单个颜色。
        width:"1"  //宽度 默认为1
      }
 
  }, 
axisLabel:{//坐标轴文本相关属性设置

    show: true,
    textStyle: {//
      color: '#a1afc8'
    }

  },
  tooltip:{//提示框组件
    show:true,//是否显示提示框组件,包括提示框浮层和 axisPointer
    trigger:"item" //触发类型,item:数据项图形触发,主要在散点图,饼图等无类目轴的图表中使用。
            axis:坐标轴触发,主要在柱状图,折线图等会使用类目轴的图表中使用。
    axisPointer:{//坐标轴指示器配置项。
      riggerOn:"click" //提示框触发的条件,可选:mousemove、click、mousemove|click、none
    }
  },
  dataZoom:{        //组件 用于区域缩放
    type: 'inside',
    disabled: false,  //是否停止组件的功能。
  },                                
}

echarts 相关属性介绍的更多相关文章

  1. 【iOS系列】-UIImageView帧动画相关属性介绍

    UIImageView帧动画相关属性介绍 1:相关属性: //An array of UIImage objects to use for an animation.存放UIImage对象,会按顺序显 ...

  2. echarts相关的可视化数据

    echarts使用步骤: 1)设置一个容器,该容器用来放图形,一定要给容器设置高度: 2)初始化echarts实例,语法:var  aa =  echarts.init(DOM); 例如: echar ...

  3. echarts相关属性设置(1)折线图篇

    option = { tooltip: { trigger: 'axis', // axisPointer: { // type: 'cross', // label: { // background ...

  4. 【java规则引擎】基本语法和相关属性介绍

    一个规则的语法信息 [1]条件部分(LSH部分)===>规则pattern之间的连接条件符号:   (1)LHS 部分是由一个或多个条件组成,条件又称之为 pattern(匹配模式),多个 pa ...

  5. echarts相关问题记录

    1.图标距离容器边界 //echats options options : { //... grid : { top : 40, //距离容器上边界40像素 bottom: 30 //距离容器下边界3 ...

  6. ECharts地理坐标系属性介绍

    在 ECharts 地理坐标系的属性设置中,如果您要将地理坐标系组件显示出来,那么,请使用 geo 组件的 show 属性.在 geo 组件中提供了两种类型的地图数据:javascript 文件与 J ...

  7. echarts相关设置

    1.显示隐藏工具栏 注释toolbox即可 /*    toolbox: {         show : true,         feature : {             dataView ...

  8. echarts相关属性设置(3)环状图

    option = { grid: { left: '3%', top: '0%', // height: 500, right: '30%', containLabel: true, }, legen ...

  9. echarts相关属性设置(2)--折线图和柱状图的结合使用

    type:bar和line的组合 option = { { tooltip: { trigger: 'axis', axisPointer: { // type: 'shadow' }, // lab ...

随机推荐

  1. Unity 分场景打包

    分场景打包步骤:导入unity中AB包后 1: 指定场景  2: 指定abname  3: 指定objinabname  4: 协同  5: 委托 void string unity 先引入命名空间  ...

  2. rowid去重(转)

    实际应用场景:数据去重--当多条记录主键相同或者多条记录完全一致时,只需要留下一条记录 delete from bal_acctbook_info where rowid not in (select ...

  3. Node.js 内置模块crypto加密模块(4) Diffie Hellman

    Diffie-Hellman( DH ):密钥交换协议/算法 ( Diffie-Hellman Key Exchange/Agreement Algorithm ) 百科摘录: Diffie-Hell ...

  4. linux网络配置详解

    一:相关网络配置的文件 1.网卡名配置相关文件 网卡名命名规则文件: /etc/udev/rules.d/70-persistent-net.rules # PCI device 0x8086:0x1 ...

  5. Git/Bitbucket Workflow

    中文 http://blog.jobbole.com/76843/ 英文 https://www.atlassian.com/git/tutorials/comparing-workflows#cen ...

  6. 关于dijkstra求最短路(模板)

    嗯....   dijkstra是求最短路的一种算法(废话,思维含量较低,   并且时间复杂度较为稳定,为O(n^2),   但是注意:!!!!         不能处理边权为负的情况(但SPFA可以 ...

  7. image在div中有留白如何解决

    解决办法: 1. 将img图片display:block,即可去掉div和img之间的空白: 2. 将div的line-height设置得足够小,也可以去掉空白,例如div{line-height:5 ...

  8. C++11随机数发生器

    前言 一直知道所谓的"随机数"都是伪随机,事实上也是满足某种规则生成的.有些程序测试时通常需要一个随机数源,但在新标准出现之前,C++都是依赖简单的C库函数rand来生成随机数的. ...

  9. Luogu P3391 文艺平衡树(Splay or FHQ Treap)

    这道题要求区间反转...好东西.. 对于Splay:把l-1旋到根,把r+1旋到根的右儿子,这样r+1的左儿子就是整个区间了,然后对这个区间打个tg 注意要插-Inf和Inf到树里面,防止越界,坐标要 ...

  10. rabbitMq解析

    import java.io.InputStream; import java.net.HttpURLConnection; import java.net.URL; import java.util ...