Autodesk Forge Viewer标记工具font-size属性不生效，如何通过代码设置？

问题描述 #

使用Autodesk Forge Viewer 7.84的Markup工具添加文本时，通过API设置的<text>元素原生font-size属性无法生效，但手动为元素添加CSS inline style则能正常改变文本大小。

尝试过两种设置方式均无效：

1. 激活文本编辑工具后设置样式：

var toolInstance = new Autodesk.Viewing.Extensions.Markups.Core.EditModeText(this.core);
this.core.changeEditMode(toolInstance);
var markup = this.core.getSelection();
var style = markup ? markup.getStyle() : this.core.getStyle();
style['font-size'] = styleValue;
this.core.setStyle(style);

2. 直接创建文本标记：

markupExt.enterEditMode();
var text1= new Autodesk.Viewing.Extensions.Markups.Core.CreateText(markupExt,2333, 
{x:10,y:10}, {x:100,y:100},'My Test String Small', {"font-size":5})
text1.execute();

两种方式生成的<text>元素都带有正确的font-size属性，但文本显示大小无变化，且不想通过创建扩展或重写Markup脚本解决问题。

无需重写脚本的解决方法 #

通过监听标记创建事件或创建后即时处理，为<text>元素添加inline style来设置字体大小，利用style的优先级覆盖原生属性，具体实现如下：

方法一：监听markupAdded事件自动处理 #

// 监听标记添加事件
markupExt.addEventListener('markupAdded', function(event) {
    const markup = event.markup;
    // 仅处理文本类型标记
    if (markup.type === 'text') {
        const svgTextElement = markup.svg;
        if (svgTextElement?.tagName === 'text') {
            const fontSize = markup.getStyle()['font-size'];
            if (fontSize) {
                // 为元素设置inline style
                svgTextElement.style.fontSize = `${fontSize}px`;
            }
        }
    }
});

方法二：创建文本后即时设置样式 #

markupExt.enterEditMode();
// 定义目标字体大小
const targetFontSize = 16;
var text1= new Autodesk.Viewing.Extensions.Markups.Core.CreateText(markupExt,2333, 
{x:10,y:10}, {x:100,y:100},'My Test String Small', {"font-size": targetFontSize})
text1.execute();

// 获取刚创建的标记并设置inline style
const newMarkup = markupExt.core.getMarkups().find(m => m.id === 2333);
if (newMarkup?.svg) {
    newMarkup.svg.style.fontSize = `${targetFontSize}px`;
}

这两种方法都无需修改Viewer核心脚本，仅通过扩展API的事件或标记实例操作即可解决font-size属性不生效的问题。

内容的提问来源于stack exchange，提问作者Tiago Raposo