echarts学习之配置项

发现最近需要使用echarts的地方越来越多,在这里进行一些学习记录,不定时更新。

这里是我对最新的官方文档的理解,但是我还看到一些配置参数可能是历史版本的,最新的官方文档里面是没有介绍的.

echarts基本使用方法:先通过init(document.getElementById("id"))方法获取操纵的元素,然后元素调用setOption(option)就可以完成一次画布的绘制。

title:

title是标题组件。可以控制主标题和次标题。

注意文字块都是基于content box,不包含padding。如果不定义textStyle下的rich属性则不能定义textStyle下的width和height。

var option = {
    title: {
        id: 'xxx', // 可用于option或者API中引用组件,默认不指定,我太菜了还没用过
        show: true, // 控制是否显示标题,默认值:true
        text: 'ABC \n DEF', // 主标题就写在这里,默认值:'',支持\n换行
        subtext: 'abc \n def',//副标题,和text一样
        link: 'https://www.baidu.com', // 给主标题添加超链接,像a标签的href,默认值:''
        sublink: 'https://www.google.com', //副标题链接,和link一样
        target: 'blank', // 功能类似a标签的target,默认值:'blank',只能在self(当前窗口)和blank(新窗口)中选择
        subtarget: 'blank', //副标题超链接打开窗口方式,和target一样
        textAlign: 'auto',//主标题副标题总的水平对齐方式,默认值:'auto',可选值:'left','right','center'
        textVerticalAlign: 'auto',//主标题副标题总的垂直对齐方式,默认值:'auto',可选值:'top','bottom','middle'
        triggerEvent: false,//是否触发事件,默认值:false,我没搞懂这有什么用
        padding: 5,//标题内边距,默认值:5(px),可以是数组,[1,2](上下1px,左右2px),[1,2,3,4](上右下左的顺序)
        itemGap: 10,//主副标题间距,默认值:10(px)
        zlevel: 0,//所有图形的zlevel值,默认值:0,和css的z-index类似
        z: 2,//和zlevel类似,控制图形的前后顺序,优先级比zlevel低,且不会创建新的canvas
        left: 'auto',//grid组件离容器左侧的距离,默认值:'auto',可选值:'left','center','right',数字,'百分比'
        right: &
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值