echarts 水球图 自定义水球颜色

项目中有一个水球图表示电池电量的需求：电量20%以下时显示红色，20%－30%时显示为黄色，30%以上显示蓝色

var option = {
    series: [{
        type: 'liquidFill',
        data: [0.6, {
            value: 0.5,
            direction: 'left',
            itemStyle: {
                normal: {
                    color: eval("if(data.value<0.2){'red'}else if(data.value<0.3){'yellow'}else{'blue'}")
                }
            }
        }, 0.4, 0.3]
    }]
};

color不支持function，在此用到了eval()方法，eval()方法接受一个要计算的javascript表达式或者要执行的语句。

注意：if条件代码块里不能return！

好多人说尽量不要用eval()方法，因为涉及到安全问题，eval()会接受传给他的任意代码。

所以设置color这个问题，如果有别的更好的方法，也欢迎赐教！