3、echarts配置项-xAxis

直角坐标系 grid 中的 x 轴，一般情况下单个 grid 组件最多只能放上下两个 x 轴，多于两个 x 轴需要通过配置 offset 属性防止同个位置多个 x 轴的重叠。

var option{xAxis:{id:'组件id',//组件 ID。默认不指定show:true/false,//是否显示 x 轴gridIndex:0,//x 轴所在的 grid 的索引，默认位于第一个 gridalignTicks:true/false,//在多个 x 轴为数值轴的时候，可以开启该配置项自动对齐刻度position:'top/bottom',//x 轴的位置offset:0,//X 轴相对于默认位置的偏移，在相同的position上有多个X轴的时候有用type:'value/category/time/log',//坐标轴类型。value:数值轴,适用于连续数据;category:类目轴，适用于离散的类目数据;time:时间轴，适用于连续的时序数据;log:对数轴。适用于对数数据name:'',//坐标轴名称nameLocation:'start/middle(center)/end',//坐标轴名称显示位置nameTextStyle{},//同legend配置项的textStylenameGap:15,//坐标轴名称与轴线之间的距离nameRotate:0,//坐标轴名字旋转，角度值inverse:false,//是否是反向坐标轴boundaryGap:true,//坐标轴两边留白策略，类目轴和非类目轴的设置和表现不一样min:0,//坐标轴刻度最小值max:'dataMax',//坐标轴刻度最大值scale:false,//只在数值轴中（type: 'value'）有效splitNumber:5,//坐标轴的分割段数minInterval:0,//自动计算的坐标轴最小间隔大小maxInterval:...,//自动计算的坐标轴最大间隔大小interval:...,//强制设置坐标轴分割间隔logBase:10,//对数轴的底数，只在对数轴中（type: 'log'）有效silent:false,//坐标轴是否是静态无法交互triggerEvent:false,//坐标轴的标签是否响应和触发鼠标事件data:{value:...,//单个类目名称textStyle:{}},axisLine{show:true,//是否显示坐标轴轴线onZero:ture,//X 轴或者 Y 轴的轴线是否在另一个轴的0刻度上，只有在另一个轴为数值轴且包含0刻度时有效onZeroAxisIndex:...,//当有双轴时，可以用这个属性手动指定，在哪个轴的0刻度上symbol:'none/arrow',//轴线两边的箭头symbolSize:[10,15],//轴线两边的箭头的大小[宽度，高度]symbolOffset:[0,0]//轴线两边的箭头的偏移，如果是数组，第一个数字表示起始箭头的偏移，第二个数字表示末端箭头的偏移},axisTick:{show:true,//是否显示坐标轴刻度alignWithLabel:false,//类目轴中在 boundaryGap 为 true 的时候有效，可以保证刻度线和标签对齐interval:0/'auto',//坐标轴刻度的显示间隔，在类目轴中有效inside:false,//坐标轴刻度是否朝内，默认朝外length:5//坐标轴刻度的长度},lineStyle:{color:'#fff',//刻度线的颜色width:1,//坐标轴刻度线宽type:'solid/dashed/dotted/',//线的类型dasheOffset:0,//设置虚线的偏移量cap:'butt/round/square',//指定线段末端的绘制方式join:'bevel/round/miter',//设置2个长度不为0的相连部分如何连接在一起的属性miterLimit:10,//设置斜接面限制比例shadowBlur:0,//图形阴影的模糊大小shadowColor:'#fff',//阴影颜色shadowOffsetX:0,//阴影水平方向上的偏移距离shadowOffsetY:0,//阴影垂直方向上的偏移距离opacity:1//图形透明度},axisLabel:{show:true,//是否显示刻度标签interval:'auto'/0,//坐标轴刻度标签的显示间隔，在类目轴中有效inside:false,//刻度标签是否朝内，默认朝外rotate:0,//刻度标签旋转的角度margin:8,//刻度标签与轴线之间的距离hideOverlap:false,//是否隐藏重叠的标签color:'#fff'//刻度标签文字的颜色},splitLine:{show:true,//是否显示分隔线interval:'auto'//坐标轴分隔线的显示间隔},}
}

3、echarts配置项-xAxis相关推荐

echarts配置项图文介绍——xAxis
echarts配置项图文介绍--xAxis 本文仅用于个人学习笔记,文中出现错误或不恰当请在评论区指出.本文仅介绍稍有难度的配置项,极其简单易懂的配置项请自行移步官网查阅文档. 一.用途直角坐标系 ...
echarts配置项属性值设置
echarts各配置项属性说明一.图表标题二.legend图例三.值域四.tooltip提示框五.dataZoom区域缩放控制器六.grid网格七.生成一个适合你的列表八.数值型坐标轴 ...
echarts的xAxis和yAxis——x轴y轴以及网格线的详细配置
先详细看一下xAxis和yAxis配置的图表效果下图详细的标注了图表中x轴y轴可见的内容说明一下: x轴y轴在echarts配置项里,从内容上来说大体上没有太大区别,x轴能用的配置项y轴基本也可以 ...
【ECharts】ECharts配置项详解
这是一个方便自己学习ECharts所编写的,如有遗漏和错误之处,欢迎各位指出文章部分转载于用户:法海521的博客"echarts各个配置项详细说明总结",地址:https://b ...
echarts legend位置_一起读 ECharts 配置项手册之 series[i]-line（上）
之前的文章写得都比较杂,还总是想不到要写点什么-- 所以最近打算把 ECharts 所有系列挨个聊一遍,写一个 series 系列的简单介绍,解决一大段时间的难选题问题- -b,顺便方便比我还新的新手 ...
ECharts 使用xAxis.axisLine.lineStyle.color设置x坐标轴轴线颜色
1 使用详解 xAxis.axisLine.lineStyle.color 说明:刻度标签文字的颜色,支持回调函数. 默认值:'#333'. 参数类型:Color. 可选值:请参考以下博客. ECha ...
echarts的xAxis的type=’time’
熟悉下echarts图表,options配置项的xAxis参数当你的数据有时间和值,你可以做成类目型折线图,也可以做成时间轴折线图.类目型就是点与点之间等距,时间不等距:而做成时间轴,则时间等距,两 ...
Echarts配置项-4
配置项setOption() 全局配置 axisPointer 坐标指示器坐标轴指示器是指示坐标轴当前刻度的工具. 如下例,鼠标悬浮到图上,可以出现标线和刻度文本.axisPointer官网实例上 ...
ECharts 使用xAxis.boundaryGap使x轴两边不留空白
1 使用详解 xAxis.boundaryGap 说明:x坐标轴两边留白策略,类目轴和非类目轴的设置和表现不一样. 默认值:true. 参数类型:boolean,Array. 可选值: (1)true ...

3、echarts配置项-xAxis

3、echarts配置项-xAxis相关推荐

最新文章

热门文章