Javascript 如何使用击倒动力学与击倒观测值_Javascript_Json_Knockout.js_Kineticjs

Javascript 如何使用击倒动力学与击倒观测值

javascript json knockout.js

Javascript 如何使用击倒动力学与击倒观测值,javascript,json,knockout.js,kineticjs,Javascript,Json,Knockout.js,Kineticjs,我最近为KineticJS找到了这个 wiki页面包含一个示例，但我不太明白它到底做了什么： <!DOCTYPE html> <html> <head> <title>A Knockout/Kinetic example</title> <script type="text/javascript" src="kinetic-v3.9.8.min.js"></script> <sc

我最近为KineticJS找到了这个

wiki页面包含一个示例，但我不太明白它到底做了什么：

<!DOCTYPE html>
<html>
  <head>
    <title>A Knockout/Kinetic example</title>
    <script type="text/javascript" src="kinetic-v3.9.8.min.js"></script>
    <script type="text/javascript" src="knockout-2.1.0.js"></script>
    <script type="text/javascript" src="../knockout-kinetic.js"></script>
  </head>
  <body>
    <!--
   This example is from the 'Rect' tutorial:
   http://www.html5canvastutorials.com/kineticjs/html5-canvas-kineticjs-rect-tutorial/
   -->
    <div id="container">
      <!-- Look, ma! No JavaScript! -->
      <!-- ko Kinetic.Stage: { width: 578, height: 200 } -->
      <!--     ko Kinetic.Layer: { } -->
      <!--         ko Kinetic.Rect: { x: 239, y: 75, width: 100, height: 50, fill: "#00D2FF", stroke: "black", strokeWidth: 4 } -->
      <!--         /ko -->
      <!--     /ko -->
      <!-- /ko -->
    </div>
    <script type="text/javascript">
        // Ok, a *little* JavaScript...
        ko.applyBindings();
    </script>
</html>

然后，我可以使用这些数据在我的ViewModel中填充一个可观察的数组但是我如何使用插件将动能绑定到它，以便矩形

自动显示和更新？

这可以分块构建。给定包含矩形数据的JavaScript对象，创建视图模型：

var viewModel=ko.可观察（数据）；
应用绑定（视图模型）；

并使用实现视图的HTML文件进行渲染：

您始终需要声明您的阶段，以及至少一个层。您可以使用敲除绑定来组织该层中的形状，或者将它们分布在多个层中，这对于您的应用程序是合适的

使用JavaScript对象后，您可以使用以下命令直接使用JSON数据：

var viewModel=ko.mapping.fromJS（数据）；
应用绑定（视图模型）；

“无JavaScript”指的是不需要使用JavaScript调用来设置Dynamic Stage内容，而代之以用户界面的声明性定义

另外，请注意语法仍在开发中。我已经有一段时间没有使用它了，所以变化不会很快发生，但我很想听听您的经验反馈

{"rectangles":[{"id":1,"x":0,"y":0,"width":200,"height":30},{"id":2,"x":0,"y":40,"width":200,"height":30}]}