2016-08-24 2 views
1

그래서 width이 120px 인 일부 개체를 렌더링하고 개체의 제목이 달라집니다. 내 문제는 제목이 너무 길어서 그것을 감싸고 새 줄에 넣지 않을 때입니다. svg에서 이런 종류의 문제를 해결할 수 있습니까?SVG에서 텍스트를 줄 바꿈하는 방법

var labels = ["Testing 123", "Things are fantastic"] 

for (var i = 0; i < labels.length; i++) 
      { 
       cell = editor.graph.cloneCells([cell])[0]; 
       // cell.setStyle(new-style); 
       editor.graph.model.valueForCellChanged(cell, label); 

       editor.toolbar.addPrototype(label, "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='43px' width='104px'>" + 
        "<rect fill='#595A5A' stroke='black' x='0' y='0' rx='5' ry='5' width='100%' height='100%'/>"+ 
        "<text text-anchor='middle' font-weight='600' font-family='Helvetica' fill='#BCCF00' x='50%' y='25' font-size='12'>" + label + "</text></svg>", cell); 
      } 

답변

3

SVG 1.1에는 자동 텍스트 배치가 없습니다. 텍스트를 자신의 라인에 배치해야합니다.

+0

정상적인 svg에서도 우리는 브레이크 라인을 사용할 수 없습니다. 오버플로를 숨기지 않고 텍스트를 포함 할 수있는 상자에 텍스트 태그를 넣을 수 있습니까? –

+1

일반 SVG 1.1에는 래핑 (wrapping) 기능이 없습니다. 이는 SVG 2가 출시 될 때 SVG 2에서 변경 될 가능성이 큽니다. 그러나 브라우저를 사용하고 있다면''엘리먼트를 [SVG 안에 HTML을 임베딩하기] (https://developer.mozilla.org/en/docs/Web/SVG/Element/)로 만들 수 있습니다. foreignObject). 그것이 유일한 옵션입니다. –

관련 문제