前端 - echarts的graphic插入图片如何更变其中心点保持始终在圆环中心？

Question

我的圆环中心点为[28%,50%]，我需要将graphic的图片一直在中心，但是发现其基准点都是为图片左上角，也没有设置偏移量的配置参数，硬将其调整百分比居中了，在其他分辨率就可能会有偏移了，该如何解决

graphic: [  {    type: 'image',    silent: true,    style: {      image: require('../assets/pieGrapic.png'),      width: 110,      height: 110,      // x: -55,      // y: -55,    },    bounding: 'raw',    top: 'middle',    left: showLegend ? '28%' : '50%',  },],series: {  name: '',  type: 'pie',  center: [showLegend ? '28%' : '50%', '50%'],  ....}

Answer 1

用 position：

const imageWidth = 110;const imageHeight = 110;const centerX = showLegend ? '28%' : '50%';const centerY = '50%';graphic: [  {    type: 'image',    silent: true,    style: {      image: require('../assets/pieGrapic.png'),      width: imageWidth,      height: imageHeight,    },    // 用 position来设置图片的位置    position: [centerX, centerY],    origin: [imageWidth / 2, imageHeight / 2],    bounding: 'raw',  },],series: {  name: '',  type: 'pie',  center: [centerX, centerY],  // ...}