‘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。