javascript - JointJS:Hello World 示例不起作用

标签 javascript jointjs

你好我正在尝试使用 JointJS 库执行 Hello world 应用程序,如:http://www.jointjs.com/tutorial#hello-world

我已经下载了joint.js(1.0.2)joint.css文件,将HelloWorld教程中给出的代码复制到html文件中,并从Chrome 浏览器,但无法如教程中所示工作。

Console.error: Uncaught TypeError: this.addCell is not a function

html 是:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1"/>
<meta name="description" content=""/>
<meta name="author" content=""/>
<title>diagram</title>
<link rel="stylesheet" href="node_modules/joint/joint.min.css">

<body>
   <div id="diaHolder">

   </div>

  <script src="node_modules/jquery/dist/jquery.min.js"></script>
  <script src="node_modules/lodash/lodash.min.js"></script>
  <script src="node_modules/backbone/backbone-min.js"></script>
  <script src="node_modules/joint/joint.min.js"></script>
  <script>
   var graph = new joint.dia.Graph;
   var paper = new joint.dia.Paper({
       el: $('#diaHolder'),
       width: 600,
       height: 200,
       model: graph,
       gridSize: 1
   });

   var rect = new joint.shapes.basic.Rect({
       position: { x: 100, y: 30 },
       size: { width: 100, height: 30 },
       attrs: { rect: { fill: 'blue' }, text: { text: 'my box', fill:       'white' } }
   });

   var rect2 = rect.clone();
   rect2.translate(300);

   var link = new joint.dia.Link({
       source: { id: rect.id },
       target: { id: rect2.id }
   });

   graph.addCells([rect, rect2, link]);
 </script>
</body>
</html>

最佳答案

检查依赖项的版本,特别是 Lodash。 JointJS 它与 4.x 版本不兼容

jQuery: 2.2.4
Lodash:3.10.1
Backbone :1.3.3

关于javascript - JointJS:Hello World 示例不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40478360/

相关文章:

javascript - Odoo 数据透视报告错误值被转换为 "Undefined"

javascript - 如何改变图表js中的列的颜色

javascript - 如何将 onclick 事件添加到 joint.js 元素?

javascript - 绘制自定义形状和弯曲矩形

javascript - 当我在链接上分配像源/目标这样的单元格时发生事件?

javascript - JointJS:使链接标签在链接本身上移动

jointjs - 我们在 JointJS 中可以做哪些动画?

javascript - 使用 Object.keys() 与 Object.values() 从对象属性创建数组

JavaScript - 类切换正在删除类而不是在下次单击时添加

javascript - 当在 TextArea 中键入超链接时,减少 javascript 中的计数器