【问题标题】:Konvajs: Text height doesn't appear in stage.toJSON() if it equals to fontSizeKonvajs:如果它等于 fontSize,则文本高度不会出现在 stage.toJSON() 中
【发布时间】:2018-08-09 22:12:23
【问题描述】:

创建文本节点后:

const text = new Konva.Text({
  x: stage.width() / 2,
  y: stage.height() / 2,
  width: 200,
  fontSize: 30,
  height: 30,
  fill: 'green',
  text: 'Simple text'
});

如果 height 值等于 fontSize 值,则函数 stage.toJSON() 不返回 height 参数:

[object Object] {
  attrs: [object Object] { ... },
  children: [[object Object] {
  attrs: [object Object] { ... },
  children: [[object Object] {
  attrs: [object Object] {
    fill: "green",
    fontSize: 30,
    text: "Simple text",
    width: 200
  },
  className: "Text"
}],
  className: "Layer"
}],
  className: "Stage"
}

这是一个 jsbin:http://jsbin.com/hikobiceji/1/edit?html,js,console

但如果 heightfontSize 不相等:

const text = new Konva.Text({
  x: stage.width() / 2,
  y: stage.height() / 2,
  width: 200,
  fontSize: 30,
  height: 30.01,
  fill: 'green',
  text: 'Simple text'
});

然后 height 参数存在:

[object Object] {
  attrs: [object Object] { ... },
  children: [[object Object] {
  attrs: [object Object] { ... },
  children: [[object Object] {
  attrs: [object Object] {
    fill: "green",
    fontSize: 30,
    height: 30.01,
    text: "Simple text",
    width: 200
  },
  className: "Text"
}],
  className: "Layer"
}],
  className: "Stage"
}

jsbin:http://jsbin.com/jiriqikeka/1/edit?html,js,console

【问题讨论】:

    标签: konvajs


    【解决方案1】:

    这就是Konva序列化的内部逻辑。 Konva 正在尝试使 JSON 尽可能小。所以它不包括属性的默认值。

    如果文本放在一行中,则文本的高度将等于其字体大小。在您的情况下,默认 getter 返回 30。由于它等于您使用的值,因此 Konva 将跳过它。

    【讨论】:

    • 非常感谢。现在干净了。
    猜你喜欢
    • 1970-01-01
    • 2020-05-06
    • 1970-01-01
    • 2023-03-26
    • 1970-01-01
    • 1970-01-01
    • 2021-08-10
    • 2022-10-31
    • 2020-10-29
    相关资源
    最近更新 更多