当前位置: 代码迷 >> JavaScript >> FabricJS-为自定义文本框渲染文本
  详细解决方案

FabricJS-为自定义文本框渲染文本

热度:44   发布时间:2023-06-05 10:26:45.0

寻找有关如何呈现传递到自定义文本框中的文本的建议。 我正在探索创建具有不同类型边框(圆形,菱形等)的文本框,并使用下面的代码,可以创建一个内部带有文本框的cirlce。 但是,文本没有显示/呈现到页面。

  addCustom2() { let customObj2 = fabric.util.createClass(fabric.Textbox, { type: 'customObj2', radius: 50, initialize: function(element, options) { console.log(this) this.callSuper('initialize', element, options); this.set({ width: 2 * this.radius, height: 2 * this.radius}); }, _render: function(ctx) { console.log("inside render 2") ctx.beginPath(); ctx.arc(0, 0 , this.radius, 0, 2 * Math.PI, false); ctx.lineWidth = 5; ctx.strokeStyle = '#003300'; ctx.stroke(); } }); this.canvas.add(new customObj2('Hello', { left: 100, top:10, fontSize: 21, stroke: 'rgba(50,80,220)', textAlign: 'center', fill: 'rgba(100,80,220)' })); 

通过我能够使圆圈出现,但是文字没有显示(这是我所看到的:)

通过检查元素,我可以看到键入时文本的变化,因此我知道它已附加到圆上。 在这里的任何帮助将不胜感激!

更改_render_renderBackground