echarts三柱图叠加三柱图解法

echarts三柱图叠加三柱图解法_第1张图片

需求如图所示。

解决思路1:实际展示柱体魏三叠加柱的和,那么把每个和计算出来作为一个柱的数组(此柱实际展示),为了tootip方便自定义取数据且不用每个都查询原始数据,做叠加柱为一般、严重、危急(此柱实际透明)。内网开发就不敲代码了,下附代码图片。

解决思路2:重点还是在tooltip数据展示,原始数据做好总和三主图,其中的一般、严重、危急数据在formatter中通过name去匹配,这种方法也是写完才猛然惊醒,就不做示例了(主要是懒)

echarts三柱图叠加三柱图解法_第2张图片echarts三柱图叠加三柱图解法_第3张图片echarts三柱图叠加三柱图解法_第4张图片echarts三柱图叠加三柱图解法_第5张图片echarts三柱图叠加三柱图解法_第6张图片echarts三柱图叠加三柱图解法_第7张图片

你可能感兴趣的:(echarts,前端,javascript)