Html 为什么Google Chrome无法在SVG中正确显示文本标记？

我有一个SVG来显示带有文本的洗衣机图标。文本是以绿色六边形显示的数字

不幸的是，当我测试的所有其他浏览器（Firefox和MicrosoftEdge）都可以显示文本时，Google Chrome无法显示文本

该字体在此代码段中不可用，但对相关问题没有影响

svg.machine{
高度：300px；
最大宽度：100%；
形状渲染：几何精度；
文本呈现：几何精度；
图像渲染：自动；
填充规则：偶数奇数；
剪辑规则：偶数奇；}
svg.machine.machine{
显示：block；}
svg.machine.machine.label{
填充：#7272；
字体系列：“开放式Sans压缩”，无衬线；
字体大小：300；
字体大小：75000px；
文本对齐：居中；
文本锚定：中间；
字母间距：-1px；}
svg.machine.machine.mask{
填充：白色；}
svg.machine.machine.draw{
填充：#727272；}
svg.machine.timer启动{
显示：无；}
svg.machine.timer up.bg{
填充：#CD2628；}
svg.machine.timer up.icon{
填充：白色；}
svg.machine.timer up.timer{
填充：#CD2628；
字体系列：“开放式Sans压缩”，无衬线；
字体大小：300；
字体大小：60000px；
文本对齐：左对齐；
文本锚定：开始；
线高：1米；
字母间距：-1px；}
svg.machine.number多边形{
填充：#00a627；
冲程：#fff；
笔画宽度：4000；
笔划线条连接：圆形；}
svg.machine.number文本{
填充物：白色；
字体大小：粗体；
字号：700；
字体大小：110000px；
字体系列：“开放式Sans”，无衬线；
文本对齐：居中；
文本锚定：开始；}

洗涤
1.

差异是由于Chrome浏览器中的

字体大小限制造成的。Chrome的最大
font size
限制是10000px。
不确定所有浏览器是否都对处理
font size:75000px
之类的内容感到高兴，这是一个相当可怕的数字。。。首先，我要修改SVG图像，以便使用“周围的数字更小”——我认为这个图标并不需要一个500000/800000的viewbox来开始，这似乎太多了。viewbox对它没有任何影响。SVG的大小由
width:300px
CSS属性调整。