ecomfe / echarts-liquidfill

Liquid Fill Chart for Apache ECharts
https://ecomfe.github.io/echarts-liquidfill/example/
BSD 3-Clause "New" or "Revised" License
1.47k stars 620 forks source link

水球图,label的align、baseline配置有问题,配置的效果都反了。 #102

Closed caiminghan closed 4 years ago

caiminghan commented 4 years ago

在label中配置align为left,文本实际位置却靠右,设置为right,文本实际位置却靠左。 类似的,在label中配置baseline为top,文本位置向下偏移,配置为bottom,文本实际位置向上偏移。 是否跟position配置有关?我在新版本中,直接配置在label而不是label.normal中,效果相同。

var option = {
    series: [{
        type: 'liquidFill',
        name: 'Liquid Fill',
        radius: '30%',
        data: [{
            name: 'First Data',
            value: 0.6
        }, 0.5, 0.4, 0.3],
        label: {
            normal: {
                formatter: function(param) {
                    //return param.seriesName + '\n'
                    //+ param.name + '\n'
                   // + 'Value: ' + param.value;
                   return param.value * 100 + '分'
                },
                textStyle  : {
                    color: 'red',
                    insideColor: 'yellow',
                    fontSize: 40
                },
                align: 'left',
                baseline: 'top',
                position: 'inside'
            }
        }
    }]
};

image

Ovilia commented 4 years ago

这个没有错误,和 ECharts 的设定是一致的。左对齐的时候,锚点还是在中间,所以得到了这样的效果,和靠右并没有直接的关系。