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. Dapper 增删改查

    0.数据库及实体类 create table Users ( Id ,) primary key, Name nvarchar() not null, Password nvarchar() not ...

  2. Spark BlockManager 概述

    Application 启动的时候: 1. 会在 SparkEnv 中实例化 BlockManagerMaster 和 MapOutputTracker,其中 (a) BlockManagerMast ...

  3. 互不侵犯king (状压dp)

    互不侵犯king (状压dp) 在N×N的棋盘里面放K个国王,使他们互不攻击,共有多少种摆放方案.国王能攻击到它上下左右,以及左上左下右上右下八个方向上附近的各一个格子,共8个格子.\(1\le n\ ...

  4. MySQL常用配置和性能压力测试:MySQL系列之十五

    一.MySQL常用配置 以下所有配置参数以32G内存的服务器为基 1.打开独立的表空间 innodb_file_per_table = 1 2.MySQL服务所允许的同时会话数的上限,默认为151,经 ...

  5. HDU2066-一个人的旅行

    题目链接:点击打开链接 Problem Description 虽然草儿是个路痴(就是在杭电待了一年多,居然还会在校园里迷路的人,汗~),但是草儿仍然很喜欢旅行,因为在旅途中 会遇见很多人(白马王子, ...

  6. SQL 日期函数转换

    1.转换函数 与date操作关系最大的就是两个转换函数:to_date(),to_char() to_date() 作用将字符类型按一定格式转化为日期类型: 具体用法:to_date('2004-11 ...

  7. day04 ---Linux安装Python3

    如何linux上安装python3 1.下载源代码,方式有2个, 1.在windows上下载,下载完成后,通过lrzsz工具,或者xftp工具,传输到linux服务器中 2.在linux中直接下载 c ...

  8. angularjs 使用angular-sortable-view实现拖拽效果(包括拖动完成后的方法使用)

    首先还是看效果图吧,方便大家可以快速得知是否是自己需要的功能:(抱歉电脑还未安装动图软件,先用.png) 如果上图是你需要的功能效果图,那么请往下看,我有写出来例子哦~ 使用这个插件有几个好处,首先: ...

  9. BZOJ 4264 小C找朋友 哈希+脑子

    好吧我觉得是脑子,别人觉得是套路$qwq$ 这道题相当于是求除了$u,v$两点互相连接,所连的点相同的点对$(u,v)$ 我们首先每个点一个随机权值,对于$u$点记为$w[u]$,然后记与$u$点相连 ...

  10. vue——踩坑

    打包的时候,要记得改一下这个配置路径~ 教程:https://www.cnblogs.com/wanf/p/7871787.html