KineticJS setText 方法像定时器一样更新答案

【问题标题】：KineticJS setText method to update like a TimerKineticJS setText 方法像定时器一样更新
【发布时间】：2013-02-18 08:34:42
【问题描述】：

我需要像计时器一样更新 KineticJS 文本的 text 属性。但我下面的代码没有按预期工作，我做错了什么：

var dateTimeText = new Kinetic.Text({
            x: 40,
            y: 400,
            text: "Sample",
            fontSize: 18,
            width: 700,
            fontFamily: 'Calibri',
            fill: 'black',
            width: 700,
            padding: 10,
            align: 'right',
            draggable: true
        });
setInterval(function () { onUpdateTime() }, 1000);
        function onUpdateTime() {
            var date = new Date();
            dateTimeText.setText(date.toLocaleTimeString());
        }

在 onUpdateTime() 中，我应该对 dateTimeText 进行操作吗？在 dateTimeText() 上添加可拖动属性并单击它时，我至少可以看到更新的值:)

【问题讨论】：

只是一些问题可以更好地理解这一点：......结果是什么/什么不起作用？应该发生什么，会发生什么？
@winner_joiner 我已经在链接中添加了当前的实现。结果：文本应根据当前时间更新“示例”文本值。现在发生的情况：文本值没有变化（除非鼠标单击文本）

标签： html text canvas timer kineticjs

【解决方案1】：

试试这个：

    function onUpdateTime() {
        var date = new Date();
        dateTimeText.setText(date.toLocaleTimeString());
        // layer.draw(); // either this, or whatever the layer is called
        // dateTimeText.getParent().draw(); // or this, auto get parent layer
        dateTimeText.getLayer().draw(); // better solution suggested by Eric Rowell
    }

【讨论】：

一个常见的忘记是重绘图层。
你也可以创建一个动画，它会更新文本对象，动画会自动重绘图层。
另外，与其假设 Text 形状的父级是图层（它可能是一个组），不如使用 dateTimeText.getLayer().draw() 代替
@EliteOctagon ：感谢您的解决方案，我几乎总是忘记重绘图层。
@EricRowell ：关于文本对象的父级，您是正确的:)，它是我应用程序中的一个组。在我的应用程序中更新上述步骤（使用图层重绘）后，在重绘图层时，我可以在我的自定义形状对象（图形控件）中看到巨大的闪烁。所以我将文本对象更改为组而不是直接在图层上。