0

我正在为 Autodesk Forge Viewer（Markupscore 扩展）创建一个自定义测量工具。我已经<path>相当容易地用 SVG 标签实现了画线部分。但是，一旦调用事件（一旦用户完成画线），我想<textarea>为用户呈现一个输入数值。onMouseUp为此，我使用foreignObject, 输入文本区域和显示文本的文本标签。出于某种原因，我在此文本区域中输入的字符是“颠倒的”。textarea 本身不是；书写方向仍然是左→右。只是个别角色颠倒了。它看起来像这样：

在此处输入图像描述

生成的标记看起来像这样：

<svg version="1.1" baseProfile="full" layer-order-id="markups-svg" style="position:absolute; left:0; top:0; transform:scale(1,-1); -ms-transform:scale(1,-1); -webkit-transform:scale(1,-1); -moz-transform:scale(1,-1); -o-transform:scale(1,-1); transformOrigin:0, 0; -ms-transformOrigin:0, 0; -webkit-transformOrigin:0, 0; -moz-transformOrigin:0, 0; -o-transformOrigin:0, 0; " width="1550" height="600" viewBox="-101.7644738631413 25.603030631786396 488.57934430714505 189.12748319689365" pointer-events="painted" cursor="crosshair">
   <g cursor="default">
      <g cursor="inherit" pointer-events="stroke">
         <path id="markup" d="m 0 5 v 0 -10 m -5 0 l 10 10 M 0 0 L 79.59484653519095 0 m 0 5 v 0 -10 m -5 0 l 10 10" stroke-width="0.49516667683974447" stroke="rgba(255,0,0,1)" fill="none" transform="translate( 25.07833084584351 , 104.7208155667812 ) rotate( 0 )"></path>
         <path id="hitarea" fill="transparent" stroke="transparent" d="m 0 5 v 0 -10 m -5 0 l 10 10 M 0 0 L 79.59484653519095 0 m 0 5 v 0 -10 m -5 0 l 10 10" stroke-width="9.95154083668433" transform="translate( 25.07833084584351 , 104.7208155667812 ) rotate( 0 )"></path>
         <foreignObject x="0" y="0" width="100" height="50" transform="translate( 25.07833084584351 , 104.7208155667812 ) rotate( 0 )">
            <textarea rows="1" dir="auto" maxlength="10" data-i18n="Text" style="resize: none; box-sizing: border-box; overflow: hidden; z-index: 1; padding: 5px; line-height: 130%; left: 468px; top: 198px; width: 150px; color: rgb(255, 0, 0); font-family: Arial; font-size: 10px; font-weight: normal; font-style: normal; height: 23px; opacity: 0; border: 1px solid red;"></textarea>
            <text style="color: red; opacity: 1;">1234</text>
         </foreignObject>
      </g>
   </g>
</svg>

知道发生了什么吗？我尝试过重置浏览器样式，我尝试过调整rotate属性，我尝试过向 SVG 添加命名空间属性，但这些属性都不会对文本方向产生任何影响。我对使用 SVG 完全陌生foreignObjects，如果我不清楚并且没有提供足够的信息，我很抱歉。

4

0 回答 0