为什么KineticJS文档中没有方法draw()? [英] Why there is no method draw() in KineticJS documentation?

查看:241
本文介绍了为什么KineticJS文档中没有方法draw()?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我花了几个小时在谷歌搜索Kinetic.Layer.draw()方法。我发现的所有内容都是用例 - 没有关于如何,何时以及为何使用它的文档。也许它已经被弃用?

I've spent hours googling about Kinetic.Layer.draw() method. All that I've found is use-cases - no documentation about how, when and why to use it. Maybe it's deprecated already?

这些是我在学习和玩这个精彩框架时使用的主要链接:

These are primary links which I use while learning and playing with this wonderful framework:

http://kineticjs.com/docs/index.html

http:// www.html5canvastutorials.com/kineticjs/html5-canvas-events-tutorials-introduction-with-kineticjs/

如果有人解释,这将非常有用我这样的误解。

It will be really helpful if somebody explains to me such misunderstanding.

推荐答案

实际上 draw() drawHit()在文档中,但是它们的记录很少:

Actually draw() and drawHit() are in the docs, but they are poorly documented:

  • http://kineticjs.com/docs/Kinetic.Stage.html#draw

draw()

draw()


绘制图层场景图

draw layer scene graphs




  • http://kineticjs.com/docs/ Kinetic.Stage.html#drawHit

    • http://kineticjs.com/docs/Kinetic.Stage.html#drawHit
    • drawHit()

      drawHit()


      绘制图层点击图

      draw layer hit graphs

      令人惊讶的是,我无法在Kinetic Docs中找到第3个和最后一个 draw 方法: drawScene()。另外令我惊讶的是,这三个函数未被发现从 Kinetic.Stage 的父类扩展: Kinetic.Container

      Surprisingly I was unable to find the 3rd and last draw method: drawScene() in the Kinetic Docs. Also to my surprise, these 3 functions were not found to be extended from the parent class of Kinetic.Stage: Kinetic.Container

      无论如何,我认为这个SO问题解释了差异完美的方法: KineticJS绘制方法之间的区别是什么?

      Anyways, I think this SO question explains the differences of the methods perfectly: What is the difference between KineticJS draw methods?

      当然,没有避免使用这些功能,你需要最终使用其中一个,除非你的画布/ stage在整个应用程序中是静态的。 (*可能有例外,见下文)

      And definitely, there's no avoiding using these functions, you'll need to use one of them eventually unless your canvas/stage is static during your entire application. (*There may be an exception, see below)

      回答你的问题:

      在任何 Kinetic.Container <上调用 .draw() / code>其中包括: stage layer group ,或任何 Kinetic.Node ,其中包括所有 Kinetic.Shape

      Call .draw() on any Kinetic.Container which includes: stage layer and group, or any Kinetic.Node which includes all the Kinetic.Shape

      示例:

      stage.draw(); //Updates the scene renderer and hit graph for the stage
      layer.drawHit(); //Updates the hit graph for layer
      rect.drawScene(); //Updates the scene renderer for this Kinetic.Rect
      



      为什么



      我认为每次有一次重写时都不会重写 Kinetic.Stage 更改。通过这种方式使用draw方法,我们可以在我们希望更新和呈现阶段时以编程方式进行控制。正如您可能想象的那样,如果我们在场景中说10000个节点,那么必须一直绘制舞台是非常昂贵的。

      Why:

      I would think it's a performance thing to not have everything redraw on the Kinetic.Stage every single time there is a change. The use of the draw methods this way we can control programatically when we want the stage to be updated and rendered. As you might imagine, it is quite expensive to have to draw the stage all the time if we have say 10000 nodes in the scene.

      drawScene()

      任何时候你需要更新场景渲染器(例如使用 .setFill()来更改形状的填充)

      Anytime you need to update either the scene renderer (for example using .setFill() to change the fill of a shape)

      drawHit()

      更新点击图如果您将事件绑定到形状,以便任何事件的命中区域将更新为节点更改。

      To update the hit graph if you're binding events to your shapes so that the hit area for any events will be updated to the node changes.

      draw()

      每当您需要执行上述两项操作时。

      Whenever you need to do both of the above.

      最后,也许一个示例/实验室将是这里最有益的学习工具,所以我准备了 JSFIDDLE 让您测试差异。按照说明阅读我的评论,以便更好地了解正在发生的事情。

      Finally, perhaps an example/lab will be the most beneficial learning tool here, so I've prepared a JSFIDDLE for you to test out the differences. Follow the instructions and read my comments inside to get a better understanding of what's going on.

      *注意:我上面提到有一个例外必须使用绘制方法。这是因为每当您向舞台添加图层时,图层中的所有内容都会自动绘制。在小提琴的底部有一个小例子。

      *NOTE: I mentioned above there was an exception to having to use the draw methods. That is because whenever you add a layer to the stage, everything in the layer is automatically drawn. There is small example of this described at the bottom of the fiddle.

      这篇关于为什么KineticJS文档中没有方法draw()?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆