html - テキスト オブジェクトを隣り合わせに配置する - KineticJS

Question

別のテキスト オブジェクトとラベル オブジェクトがあります。描画するときは、互いに並べて配置する必要があります。x 座標と y 座標を追加していますが、オブジェクトが数ピクセルずれており、同じ線上にありません。これが私のコードです。テキストがどのようにレンダリングされているかの写真を追加しました。

![var extractedSubString  = text.substring(currentTextOffset,value.begin-1)
            console.log(extractedSubString)
            currentTextOffset += value.end

             var complexText = new Kinetic.Text({
                x:x,
                y:y,
                width:3000,
                text: extractedSubString,
                fontSize: 14,
                fontFamily: 'Helvetica',
                fill: '#555',
                align: 'left'
            });

            x += complexText.getTextWidth()
            y += complexText.getHeight()

            group.add(complexText)
            var simpleLabel = new Kinetic.Label({
                opacity: 0.75,
                x:x,
                y:y,
                text: {
                    text: value.data,
                    fontFamily: 'Helvetica',
                    fontSize: 14,
                    padding: 5,
                    fill: '#555'
                },
                rect: {
                    fill: labelColor
                }
            });

            group.add(simpleLabel)
            x +=simpleLabel.getWidth()
            y +=simpleLabel.getHeight()][1]