echarts各个配置项详细说明.doc
- 文档编号:2275190
- 上传时间:2022-10-28
- 格式:DOC
- 页数:13
- 大小:493.46KB
echarts各个配置项详细说明.doc
《echarts各个配置项详细说明.doc》由会员分享,可在线阅读,更多相关《echarts各个配置项详细说明.doc(13页珍藏版)》请在冰豆网上搜索。
echarts各个配置项详细说明总结
最近有个朋友在做关于各种图表的项目,用到了echarts,关于各个配置项刚开始用好多都不懂,有些地方需要改不知道改哪个参数,就在网上查了各种,找到了一个不错的总结,分享给大家。
(echarts官网也有配置项说明文档。
)
theme={
//全图默认背景
//backgroundColor:
'rgba(0,0,0,0)',
//默认色板
color:
['#ff7f50','#87cefa','#da70d6','#32cd32','#6495ed',
'#ff69b4','#ba55d3','#cd5c5c','#ffa500','#40e0d0',
'#1e90ff','#ff6347','#7b68ee','#00fa9a','#ffd700',
'#6699FF','#ff6666','#3cb371','#b8860b','#30e0e0'],
//图表标题
title:
{
x:
'left',//水平安放位置,默认为左对齐,可选为:
//'center'¦'left'¦'right'
//¦{number}(x坐标,单位px)
y:
'top',//垂直安放位置,默认为全图顶端,可选为:
//'top'¦'bottom'¦'center'
//¦{number}(y坐标,单位px)
//textAlign:
null//水平对齐方式,默认根据x设置自动调整
backgroundColor:
'rgba(0,0,0,0)',
borderColor:
'#ccc',//标题边框颜色
borderWidth:
0,//标题边框线宽,单位px,默认为0(无边框)
padding:
5,//标题内边距,单位px,默认各方向内边距为5,
//接受数组分别设定上右下左边距,同css
itemGap:
10,//主副标题纵向间隔,单位px,默认为10,
textStyle:
{
fontSize:
18,
fontWeight:
'bolder',
color:
'#333'//主标题文字颜色
},
subtextStyle:
{
color:
'#aaa'//副标题文字颜色
}
},
//图例
legend:
{
orient:
'horizontal',//布局方式,默认为水平布局,可选为:
//'horizontal'¦'vertical'
x:
'center',//水平安放位置,默认为全图居中,可选为:
//'center'¦'left'¦'right'
//¦{number}(x坐标,单位px)
y:
'top',//垂直安放位置,默认为全图顶端,可选为:
//'top'¦'bottom'¦'center'
//¦{number}(y坐标,单位px)
backgroundColor:
'rgba(0,0,0,0)',
borderColor:
'#ccc',//图例边框颜色
borderWidth:
0,//图例边框线宽,单位px,默认为0(无边框)
padding:
5,//图例内边距,单位px,默认各方向内边距为5,
//接受数组分别设定上右下左边距,同css
itemGap:
10,//各个item之间的间隔,单位px,默认为10,
//横向布局时为水平间隔,纵向布局时为纵向间隔
itemWidth:
20,//图例图形宽度
itemHeight:
14,//图例图形高度
textStyle:
{
color:
'#333'//图例文字颜色
}
},
//值域
dataRange:
{
orient:
'vertical',//布局方式,默认为垂直布局,可选为:
//'horizontal'¦'vertical'
x:
'left',//水平安放位置,默认为全图左对齐,可选为:
//'center'¦'left'¦'right'
//¦{number}(x坐标,单位px)
y:
'bottom',//垂直安放位置,默认为全图底部,可选为:
//'top'¦'bottom'¦'center'
//¦{number}(y坐标,单位px)
backgroundColor:
'rgba(0,0,0,0)',
borderColor:
'#ccc',//值域边框颜色
borderWidth:
0,//值域边框线宽,单位px,默认为0(无边框)
padding:
5,//值域内边距,单位px,默认各方向内边距为5,
//接受数组分别设定上右下左边距,同css
itemGap:
10,//各个item之间的间隔,单位px,默认为10,
//横向布局时为水平间隔,纵向布局时为纵向间隔
itemWidth:
20,//值域图形宽度,线性渐变水平布局宽度为该值*10
itemHeight:
14,//值域图形高度,线性渐变垂直布局高度为该值*10
splitNumber:
5,//分割段数,默认为5,为0时为线性渐变
color:
['#1e90ff','#f0ffff'],//颜色
//text:
['高','低'],//文本,默认为数值文本
textStyle:
{
color:
'#333'//值域文字颜色
}
},
toolbox:
{
orient:
'horizontal',//布局方式,默认为水平布局,可选为:
//'horizontal'¦'vertical'
x:
'right',//水平安放位置,默认为全图右对齐,可选为:
//'center'¦'left'¦'right'
//¦{number}(x坐标,单位px)
y:
'top',//垂直安放位置,默认为全图顶端,可选为:
//'top'¦'bottom'¦'center'
//¦{number}(y坐标,单位px)
color:
['#1e90ff','#22bb22','#4b0082','#d2691e'],
backgroundColor:
'rgba(0,0,0,0)',//工具箱背景颜色
borderColor:
'#ccc',//工具箱边框颜色
borderWidth:
0,//工具箱边框线宽,单位px,默认为0(无边框)
padding:
5,//工具箱内边距,单位px,默认各方向内边距为5,
//接受数组分别设定上右下左边距,同css
itemGap:
10,//各个item之间的间隔,单位px,默认为10,
//横向布局时为水平间隔,纵向布局时为纵向间隔
itemSize:
16,//工具箱图形宽度
featureImageIcon:
{},//自定义图片icon
featureTitle:
{
mark:
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- echarts 各个 配置 详细 说明