关于echarts:Echarts-雷达图指示器名称rich使用

56次阅读

共计 1217 个字符，预计需要花费 4 分钟才能阅读完成。

‘radar.name’: {

textStyle: {color: '#5a4b66'},
formatter: (str) => {let obj = _.find(personalityChart, (pc: any) => pc.image === str) || {};
    let percent = obj.percent ? `${Math.round(obj.percent * 100)}%` : '-';
    return `{b|${percent}}  {c|${str}}`;
},
rich: {
    b: {color: '#F78A89'}
}

},
‘**tooltip.formatter’: (opts) => {

let indicator = _.get(opts, 'radar.indicator');
return (obj) => {
    let {
        name,
        value
    } = obj.data;
    let contentArr = indicator.map((key, inx) => `${key.name}: ${value[inx]}`);
    contentArr.unshift(obj.marker + name);
    return contentArr.join('<br />');
};

}

let personalityChart = [{

"celebrity": "","celebrity_code":"12345","id": 17,"image":" 人品 ","negative": 553,"percent": 0.6545,"positive": 4492,"total": 6018,"x":" 人品 ","name":" 王俊凯 ","value": 6018

}, {

"celebrity": "","celebrity_code":"12345","id": 21,"image":" 品尝 ","negative": 157,"percent": 0.6256,"positive": 2974,"total": 4503,"x":" 品尝 ","name":" 王俊凯 ","value": 4503

}, {

"celebrity": "","celebrity_code":"12345","id": 22,"image":" 声音 ","negative": 3,"percent": 0.9225,"positive": 777,"total": 839,"x":" 声音 ","name":" 王俊凯 ","value": 839

}];
percent 来自原始数据 personalityChart，str 来自 echarts 渲染后数据

在 tooltip 格式化解决系列名，画图字段为 value，效果图：

问题二：echarts-series 中 label 的 backgroundColor 有效
一开始我是像下面那样写的发现图片出不来，不能用本地的图片

所以我把图片放到服务器上通过 http 去申请获取，然而发现图片长宽不是我设置的长宽

查看配置文档发现

如果不定义 rich 属性，则不能指定 width 和 height。

正文完