awesome-titleecharts 配置项内容和展示

学习配置项ititle

配置项如下
      option = {
    title: {
        // 标题id
        id: 'title',
        // 标题
        text: 'Awesome Chart',
        // 点击标题跳转链接
        link: 'https://weixin.qq.com/',
        // 链接跳转方式
        target: 'self',
        // 文本样式
        textStyle: {
            // 字体颜色
            color: '#333' ,
            // 字体风格
            fontStyle: 'normal' ,
            // 字体粗细
            fontWeight: 'bolder' ,
            // 字体
            fontFamily: 'sans-serif' ,
            // 字号
            fontSize: 24,
            // 行高
            lineHeight: 20,
            // 宽度
            width: 10,
            //高度
            height: 20 ,
            textBorderColor: 'white' ,
            textBorderWidth: 5 ,
            // 分别为阴影颜色,模糊距离,x上的偏移,y上的偏移
            textShadowColor: 'transparent' ,
            textShadowBlur: 0 ,
            textShadowOffsetX: 0 ,
            textShadowOffsetY: 0 ,
            // 文本超过宽度是截断还是换行
            overflow: 'truncate',
            // 长度超出宽度的时候显示效果,overflow为truncate时有效
            ellipsis: '...' ,
            // 文本超出高度部分是否截断,配置height时有效。'truncate' 在文本行数超出高度部分截断
            lineOverflow: 'truncate' ,
            // rich: {
            //         a: {
            //             color: "#fff" ,
            //             fontStyle: 'normal' ,
            //             fontWeight: 'normal' ,
            //             fontFamily: 'sans-serif' ,
            //             fontSize: 12 ,
            //             align: 'left' ,
            //             verticalAlign: 'top' ,
            //             lineHeight: 18 ,
            //             backgroundColor: 'transparent' ,
            //             borderColor: 'red' ,
            //             borderWidth: 0 ,
            //             borderRadius: 0 ,
            //             padding: 0 ,
            //             shadowColor: 'transparent' ,
            //             shadowBlur: 0 ,
            //             shadowOffsetX: 0 ,
            //             shadowOffsetY: 0 ,
            //             width: 200 ,
            //             height: 200 ,
            //             textBorderColor: 'red' ,
            //             textBorderWidth: 2 ,
            //             textShadowColor: 'transparent' ,
            //             textShadowBlur: 0 ,
            //             textShadowOffsetX: 0 ,
            //             textShadowOffsetY: 0 ,
            //         }
            //     }
        },
        // 副标题
        subtext: '副标题' ,
        // 副标题链接
        sublink: '' ,
        // 链接跳转方式
        subtarget: 'blank' ,
        // 副标题样式
        subtextStyle: {} , // 参考textStyle
        // 标题和副标题整体在水平方向上的对齐方式
        textAlign: 'left' ,
        // 标题和副标题整体在垂直方向上的对齐方式
        textVerticalAlign: 'auto' ,
        // triggerEvent: false ,
        // 内边距
        padding: 15 ,
        // 标题和副标题之间的间距
        itemGap: 0 ,
        // 层叠
        // zlevel: 0 ,
        // z: 2 ,
        // 距容器坐上右下的距离
        left: 'center' ,
        top: '10%' ,
        right: 'auto' ,
        bottom: 'auto' ,
        // 背景颜色
        backgroundColor: 'yellow' ,
        // 边框颜色
        borderColor: 'green' ,
        // 边框大小
        borderWidth: 1 ,
        // 边框圆角
        borderRadius: 10 ,
        // 分别为阴影颜色,模糊距离,x上的偏移,y上的偏移
        shadowBlur: 2 ,
        shadowColor: 'red' ,
        shadowOffsetX: 0 ,
        shadowOffsetY: 0 ,
    }
};
    
截图如下