[Bug] 标注标签的包围盒计算未考虑主题上的配置字体，导致最终绘制宽度偏大

[kkxxkk2019]

Version

latest

Link to Minimal Reproduction

none

Steps to Reproduce

const spec = {
   theme: {
     fontFamily: 'serif'
   },
  "type": "waterfall",
  "xField": [
    "240108123129318"
  ],
  "yField": [
    "10002"
  ],
  "direction": "vertical",
  "sortDataByAxis": true,
  "seriesField": "type",
  "padding": {
    right: 100
  },
  "labelLayout": "region",
  "data": [
    {
      "id": "data",
      "values": [
        {
          "10001": "销售额",
          "10002": "2447301.017000004",
          "10003": "240108123129265",
          "20001": "销售额",
          "240108123129265": "2447301.017000004",
          "240108123129318": "华北",
          "type": "increase"
        },
        {
          "10001": "销售额",
          "10002": "4684506.442",
          "10003": "240108123129265",
          "20001": "销售额",
          "240108123129265": "4684506.442",
          "240108123129318": "华东",
          "type": "increase"
        },
        {
          "10001": "销售额",
          "10002": "1303124.508000002",
          "10003": "240108123129265",
          "20001": "销售额",
          "240108123129265": "1303124.508000002",
          "240108123129318": "西南",
          "type": "increase"
        },
        {
          "10001": "销售额",
          "10002": "4137415.0929999948",
          "10003": "240108123129265",
          "20001": "销售额",
          "240108123129265": "4137415.0929999948",
          "240108123129318": "中南",
          "type": "increase"
        },
        {
          "10001": "销售额",
          "10002": "815039.5959999998",
          "10003": "240108123129265",
          "20001": "销售额",
          "240108123129265": "815039.5959999998",
          "240108123129318": "西北",
          "type": "increase"
        },
        {
          "10001": "销售额",
          "10002": "2681567.469000001",
          "10003": "240108123129265",
          "20001": "销售额",
          "240108123129265": "2681567.469000001",
          "240108123129318": "东北",
          "type": "increase"
        },
        {
          "10001": "销售额",
          "10002": "16068954.125",
          "10003": "240108123129265",
          "20001": "销售额",
          "240108123129265": "2447301.017000004",
          "240108123129318": "总计",
          "type": "total",
          "isTotal": true
        }
      ],
      "fields": {
        "10001": {
          "alias": "指标名称 "
        },
        "10002": {
          "alias": "指标值 "
        },
        "20001": {
          "alias": "图例项 ",
          "domain": [
            "销售额"
          ],
          "lockStatisticsByDomain": true
        },
        "240108123129265": {
          "alias": "销售额"
        },
        "240108123129318": {
          "alias": "地区",
          "domain": [
            "华北",
            "华东",
            "西南",
            "中南",
            "西北",
            "东北",
            "总计"
          ],
          "lockStatisticsByDomain": true,
          "sortIndex": 0
        }
      }
    }
  ],
  "color": {
    "field": "type",
    "type": "ordinal",
    "domain": [
      "increase",
      "total"
    ],
    "range": [
      "#58A55C",
      "#3D77E4"
    ]
  },
  "total": {
    "type": "field",
    "tagField": "isTotal",
    "valueField": "10002"
  },
  "axes": [
    {
      "id": "axes_0",
      "type": "band",
      "tick": {
        "visible": false
      },
      "grid": {
        "visible": false,
        "style": {
          "zIndex": 150,
          "stroke": "#DADCDD",
          "lineWidth": 1,
          "lineDash": [
            4,
            2
          ]
        }
      },
      "orient": "bottom",
      "visible": true,
      "domainLine": {
        "visible": true,
        "style": {
          "lineWidth": 1,
          "stroke": "#989999"
        }
      },
      "title": {
        "visible": false,
        "space": 5,
        "text": "",
        "style": {
          "fontSize": 12,
          "fill": "#363839",
          "fontWeight": "normal"
        }
      },
      "sampling": false,
      "zIndex": 200,
      "label": {
        "visible": true,
        "space": 4,
        "style": {
          "fontSize": 12,
          "fill": "#6F6F6F",
          "angle": 0,
          "fontWeight": "normal",
          "direction": "horizontal",
          "maxLineWidth": 174
        },
        "autoHide": true,
        "autoHideMethod": "greedy",
        "flush": true
      },
      "hover": true,
      "background": {
        "visible": true,
        "state": {
          "hover": {
            "fillOpacity": 0.08,
            "fill": "#141414"
          },
          "hover_reverse": {
            "fillOpacity": 0.08,
            "fill": "#141414"
          }
        }
      },
      "paddingInner": 0.36249999999999993,
      "paddingOuter": 0.175
    },
    {
      "id": "axes_1",
      "type": "linear",
      "tick": {
        "visible": false,
        "tickMode": "d3",
        "style": {
          "stroke": "rgba(255, 255, 255, 0)"
        }
      },
      "niceType": "accurateFirst",
      "zIndex": 200,
      "grid": {
        "visible": true,
        "style": {
          "zIndex": 150,
          "stroke": "#DADCDD",
          "lineWidth": 1,
          "lineDash": [
            4,
            2
          ]
        }
      },
      "orient": "left",
      "visible": true,
      "domainLine": {
        "visible": true,
        "style": {
          "lineWidth": 1,
          "stroke": "rgba(255, 255, 255, 0)"
        }
      },
      "title": {
        "visible": false,
        "text": "",
        "space": 8,
        "style": {
          "fontSize": 12,
          "fill": "#363839",
          "fontWeight": "normal"
        }
      },
      "sampling": false,
      "label": {
        "visible": true,
        "space": 6,
        "flush": true,
        "padding": 0,
        "style": {
          "fontSize": 12,
          "maxLineWidth": 174,
          "fill": "#6F6F6F",
          "angle": 0,
          "fontWeight": "normal",
          "dy": -1,
          "direction": "horizontal"
        },
        "autoHide": true,
        "autoHideMethod": "greedy"
      },
      "hover": true,
      "background": {
        "visible": true,
        "state": {
          "hover": {
            "fillOpacity": 0.08,
            "fill": "#141414"
          },
          "hover_reverse": {
            "fillOpacity": 0.08,
            "fill": "#141414"
          }
        }
      },
      "expand": {
        "max": 0.027
      },
      "zero": true,
      "nice": true
    }
  ],
  "label": {
    "visible": true,
    "offset": 0,
    "overlap": {
      "hideOnHit": true,
      "avoidBaseMark": false,
      "strategy": [
        {
          "type": "position",
          "position": []
        },
        {
          "type": "moveY",
          "offset": [
            -10,
            -9,
            -8,
            -7,
            -6,
            -5,
            -4,
            -3,
            -2,
            -1,
            0,
            1,
            2,
            3,
            4,
            5,
            6,
            7,
            8,
            9,
            10
          ]
        },
        {
          "type": "moveX",
          "offset": [
            -10,
            -9,
            -8,
            -7,
            -6,
            -5,
            -4,
            -3,
            -2,
            -1,
            0,
            1,
            2,
            3,
            4,
            5,
            6,
            7,
            8,
            9,
            10
          ]
        }
      ],
      "clampForce": true
    },
    "style": {
      "fontSize": 12,
      "fontWeight": "normal",
      "zIndex": 400,
      "lineHeight": "100%",
      "fill": "#363839",
      "lineWidth": 1,
      "strokeOpacity": 1
    },
    "position": "inside",
    "smartInvert": {
      "fillStrategy": "invertBase",
      "strokeStrategy": "similarBase",
      "outsideEnable": false
    }
  },
  "stackLabel": {
    "visible": false
  },
  "leaderLine": {
    "style": {
      "lineDash": [
        1,
        1
      ]
    }
  },
  "region": [
    {
      "clip": true,
      "id": "region_0"
    }
  ],
  "background": "transparent",
  "tooltip": {
    "handler": {},
    "id": "tooltip_0"
  },
  "hover": {
    "enable": true
  },
  "select": {
    "enable": true
  },
  "bar": {
    "state": {
      "hover": {
        "cursor": "pointer",
        "fillOpacity": 0.8,
        "stroke": "#58595B",
        "lineWidth": 1,
        "zIndex": 500
      },
      "selected": {
        "cursor": "pointer",
        "fillOpacity": 1,
        "stroke": "#58595B",
        "lineWidth": 1
      },
      "selected_reverse": {
        "fillOpacity": 0.3,
        "strokeWidth": 0.3
      }
    }
  },
  "animation": false,
  "hash": "9218bc9ae127c1df4ae7c62f1bad5d74",
  "markArea": [],
  "markLine": [
    {
      "id": "03895dbd-e747-401a-8537-2d9b56ab8ec5",
      "name": "h-line",
      "interactive": true,
      "y": "average",
      "endSymbol": {
        "visible": true,
        "size": 10,
        "refX": 6,
        "symbolType": "triangleLeft",
        "autoRotate": false,
        "style": {
          "fill": "#000",
          "lineWidth": 0,
          "stroke": null
        }
      },
      "label": {
        "visible": true,
        "autoRotate": false,
        "text": 4591129,
        "position": "end",
        "labelBackground": {
          "visible": true
        },
        "style": {
          "fill": "#000"
        },
        "refX": 16,
        "refY": 0,
        "pickable": true,
        "childrenPickable": false
      },
      "line": {
        "style": {
          "stroke": "#000",
          "lineWidth": 1,
          "pickStrokeBuffer": 16
        }
      },
      "_originValue_": 4591129.75,
      "zIndex": 510
    }
  ],
  "width": 400,
  "height": 360
};
const vchart = new VChart(spec, { dom: CONTAINER_ID });
vchart.renderAsync();

// Just for the convenience of console debugging, DO NOT COPY!
window['vchart'] = vchart;

Current Behavior

Expected Behavior

NA

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

No response

[kkxxkk2019]

定位发现是组件层的问题，见关联 PR：VisActor/VRender#877，期望在 1.8.7 版本或者 1.8 的其他小版本带上