Совместные JS, как выровнять текст слева от объекта Rect

Question

им Рисование диаграммы с помощью совместных JS, поэтому им создавать некоторые объекты Rect с текстом внутри, но мне нужно, чтобы выровнять этот текст слева:

var rectname = new joint.shapes.basic.Rect({ 
      position: { x: 110, y: y_value }, 
      size: { width: 450, height: 45 }, 
      attrs: { 
       rect: { fill: bgcolor2,'stroke-width': 0 }, 
       text: { 
        text: 'Any text here', 
        fill: 'white' 
       } 
      } 
     }); 

Я уже пробовал это свойство текста, как это, но он не работает:

var rectname = new joint.shapes.basic.Rect({ 
      position: { x: 110, y: y_value }, 
      size: { width: 450, height: 45 }, 
      attrs: { 
       rect: { fill: bgcolor2,'stroke-width': 0 }, 
       text: { 
        text: 'Any text here', 
        fill: 'white' 
        'ref-x': .5, 
        'ref-y': .5, 
        ref: 'rect', 
        'y-alignment': 'middle', 
        'x-alignment': 'left' 
       } 
      } 
     }); 

а также пытался settting обоего х и выравнивания у в «среднего» без результатов.

Любая идея пожалуйста ?? спасибо заранее

Answer 1

Используйте этикетку, чтобы установить текст элемент и использование «текст-якорь» свойство, чтобы установить выравнивание текста, как показано ниже

var rectname = new joint.shapes.basic.Rect({ 
     position: { x: 110, y: y_value }, 
     size: { width: 450, height: 45 }, 
     attrs: { 
      '.label': {text: 'Any text here', 'text-anchor': 'end'} 
     } 
    }); 

Более подробная информацию о текстовых якорном свойстве можно найти здесь https://developer.mozilla.org/en/docs/Web/SVG/Attribute/text-anchor