echarts各个配置项详细说明Word文件下载.docx
- 文档编号:20749855
- 上传时间:2023-01-25
- 格式:DOCX
- 页数:25
- 大小:21.42KB
echarts各个配置项详细说明Word文件下载.docx
《echarts各个配置项详细说明Word文件下载.docx》由会员分享,可在线阅读,更多相关《echarts各个配置项详细说明Word文件下载.docx(25页珍藏版)》请在冰豆网上搜索。
//图表标题
title:
{
x:
left'
//水平安放位置,默认为左对齐,可选为:
//'
center'
¦
right'
//¦
{number}(x坐标,单位px)
y:
top'
//垂直安放位置,默认为全图顶端,可选为:
bottom'
{number}(y坐标,单位px)
//textAlign:
null//水平对齐方式,默认根据x设置自动调整
backgroundColor:
borderColor:
#ccc'
//标题边框颜色
borderWidth:
0,//标题边框线宽,单位px,默认为0(无边框)
padding:
5,//标题内边距,单位px,默认各方向内边距为5,
//接受数组分别设定上右下左边距,同css
itemGap:
10,//主副标题纵向间隔,单位px,默认为10,
textStyle:
fontSize:
18,
fontWeight:
bolder'
#333'
//主标题文字颜色
},
subtextStyle:
#aaa'
//副标题文字颜色
}
//图例
legend:
orient:
horizontal'
//布局方式,默认为水平布局,可选为:
vertical'
//水平安放位置,默认为全图居中,可选为:
//图例边框颜色
0,//图例边框线宽,单位px,默认为0(无边框)
5,//图例内边距,单位px,默认各方向内边距为5,
10,//各个item之间的间隔,单位px,默认为10,
//横向布局时为水平间隔,纵向布局时为纵向间隔
itemWidth:
20,//图例图形宽度
itemHeight:
14,//图例图形高度
//图例文字颜色
//值域
dataRange:
//布局方式,默认为垂直布局,可选为:
//水平安放位置,默认为全图左对齐,可选为:
//垂直安放位置,默认为全图底部,可选为:
//值域边框颜色
0,//值域边框线宽,单位px,默认为0(无边框)
5,//值域内边距,单位px,默认各方向内边距为5,
20,//值域图形宽度,线性渐变水平布局宽度为该值*10
14,//值域图形高度,线性渐变垂直布局高度为该值*10
splitNumber:
5,//分割段数,默认为5,为0时为线性渐变
['
#f0ffff'
],//颜色
//text:
高'
低'
],//文本,默认为数值文本
//值域文字颜色
toolbox:
//水平安放位置,默认为全图右对齐,可选为:
color:
#22bb22'
#4b0082'
#d2691e'
//工具箱背景颜色
//工具箱边框颜色
0,//工具箱边框线宽,单位px,默认为0(无边框)
5,//工具箱内边距,单位px,默认各方向内边距为5,
itemSize:
16,//工具箱图形宽度
featureImageIcon:
{},//自定义图片icon
featureTitle:
mark:
辅助线开关'
markUndo:
删除辅助线'
markClear:
清空辅助线'
dataZoom:
区域缩放'
dataZoomReset:
区域缩放后退'
dataView:
数据视图'
lineChart:
折线图切换'
barChart:
柱形图切换'
restore:
还原'
saveAsImage:
保存为图片'
//提示框
tooltip:
trigger:
item'
//触发类型,默认数据触发,见下图,可选为:
'
axis'
showDelay:
20,//显示延迟,添加显示延迟可以避免频繁切换,单位ms
hideDelay:
100,//隐藏延迟,单位ms
transitionDuration:
0.4,//动画变换时间,单位s
rgba(0,0,0,0.7)'
//提示背景颜色,默认为透明度为0.7的黑色
//提示边框颜色
borderRadius:
4,//提示边框圆角,单位px,默认为4
0,//提示边框线宽,单位px,默认为0(无边框)
5,//提示内边距,单位px,默认各方向内边距为5,
axisPointer:
{//坐标轴指示器,坐标轴触发有效
type:
line'
//默认为直线,可选为:
|'
shadow'
lineStyle:
{//直线指示器样式设置
#48b'
width:
2,
type:
solid'
shadowStyle:
{//阴影指示器样式设置
auto'
//阴影大小
rgba(150,150,150,0.3)'
//阴影颜色
#fff'
//区域缩放控制器
dataZoom:
//x:
{number},//水平安放位置,默认为根据grid参数适配,可选为:
//{number}(x坐标,单位px)
//y:
{number},//垂直安放位置,默认为根据grid参数适配,可选为:
//{number}(y坐标,单位px)
//width:
{number},//指定宽度,横向布局时默认为根据grid参数适配
//height:
{number},//指定高度,纵向布局时默认为根据grid参数适配
//背景颜色
dataBackgroundColor:
#eee'
//数据背景颜色
fillerColor:
rgba(144,197,237,0.2)'
//填充颜色
handleColor:
rgba(70,130,180,0.8)'
//手柄颜色
//网格
grid:
80,
60,
x2:
y2:
{totalWidth}-x-x2,
{totalHeight}-y-y2,
1,
//类目轴
categoryAxis:
position:
//位置
nameLocation:
end'
//坐标轴名字位置,支持'
start'
boundaryGap:
true,//类目起始和结束两端空白策略
axisLine:
{//坐标轴线
show:
true,//默认显示,属性show控制显示与否
lineStyle:
{//属性lineStyle控制线条样式
axisTick:
{//坐标轴小标记
true,//属性show控制显示与否,默认不显示
interval:
//onGap:
null,
inside:
false,//控制小标记是否在grid里
length:
5,//属性length控制线长
1
axisLabel:
{//坐标轴文本标签,详见axis.axisLabel
true,
rotate:
0,
margin:
8,
//formatter:
{//其余属性默认使用全局文本样式,详见TEXTSTYLE
splitLine:
{//分隔线
{//属性lineStyle(详见lineStyle)控制线条样式
splitArea:
{//分隔区域
false,//默认不显示,属性show控制显示与否
areaStyle:
{//属性areaStyle(详见areaStyle)控制区域样式
rgba(250,250,250,0.3)'
rgba(200,200,200,0.3)'
]
//数值型坐标轴默认参数
valueAxis:
nameTextStyle:
{},//坐标轴文字样式,默认取全局样式
[0,0],//数值起始和结束两端空白策略
5,//分割段数,默认为5
false,//属性show控制显示与否,默认不显示
polar:
center:
50%'
'
],//默认全局居中
radius:
75%'
startAngle:
90,
splitNumber:
5,
name:
false,
splitArea:
show:
areaStyle:
splitLine:
width:
//柱形图默认参数
bar:
barMinHeight:
0,//最小高度改为0
//barWidth:
null,//默认自适应
barGap:
30%'
//柱间距离,默认为柱形宽度的30%,可设固定值
barCategoryGap:
20%'
//类目间柱形距离,默认为类目间距的20%,可设固定值
itemStyle:
normal:
//color:
各异'
barBorderColor:
//柱条边线
barBorderRadius:
0,//柱条边线圆角,单位px,默认为0
barBorderWidth:
1,//柱条边线线宽,单位px,默认为1
label:
false
//position:
默认自适应,水平布局为'
,垂直布局为'
,可选为
inside'
|'
//textStyle:
null//默认使用全局文本样式,详见TEXTSTYLE
emphasis:
//折线图默认参数
line:
各异,
shadowColor:
//默认透明
shadowBlur:
shadowOffsetX:
3,
shadowOffsetY:
3
//smooth:
//symbol:
null,//拐点图形类型
symbolSize:
2,//拐点图形大小
//symbolRotate:
null,//拐点图形旋转控制
showAllSymbol:
false//标志图形默认只有主轴显示(随主轴标签间隔隐藏策略)
//K线图默认参数
k:
//barWidth:
null//默认自适应
//barMaxWidth:
null//默认自适应
//阳线填充颜色
color0:
#00aa11'
//阴线填充颜色
#ff3200'
//阳线边框颜色
//阴线边框颜色
//color0:
各异
//散点图默认参数
scatter:
null,//图形类型
4,//图形大小,半宽(半径)参数,当图形为方向或菱形则总宽度为symbolSize*2
//
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- echarts 各个 配置 详细 说明