我使用Ext.draw.Text为Ext图表创建了一个自定义图例面板....在我的应用程序中,图例可能有很长的自定义文本。所以我需要使用固定长度拆分它们。一种方法是使用Javascript分割文本,并为文本的每个部分创建文本精灵。
还有其他方法可以在Ext.draw.Text中分割文本吗?
代码:
Ext.create('Ext.draw.Component', {
renderTo: Ext.getBody(),
width: 800,
height: 200,
items: [{
type: 'rect',
fill: 'red',
width: 12,
height: 12,
x: 5,
y: 10
},{
type: "text",
text: "This is a long text.. Can i split this into two tspan",
fill: "green",
width: 12,
height: 12,
font: "18px monospace",
x: 25,
y: 15
}]
});
提前致谢。
答案 0 :(得分:0)
通过在文字内容中插入换行符号,我成功地为Ext.draw.text
生成了多个tspan(' \ n')。 JSFiddle
Ext.create('Ext.draw.Component', {
renderTo: Ext.getBody(),
width: 800,
height: 200,
items: [{
type: 'rect',
fill: 'red',
width: 12,
height: 12,
x: 5,
y: 10
},{
type: "text",
text: "This is a long text.. \n Can i split this into two tspan", //Added new line character
fill: "green",
width: 12,
height: 12,
font: "18px monospace",
x: 25,
y: 15
}]
});