2016-11-08 2 views
1

funktioniert Hallo Ich versuche, in als gegeben Hallo Welt Anwendung mit JointJS Bibliothek auszuführen: http://www.jointjs.com/tutorial#hello-worldJointJS: Hallo Welt Beispiel nicht

ich heruntergeladen haben joint.js(1.0.2) und joint.css Dateien, kopiert die in Hello World Tutorial gegebenen Code in html-Datei und auf sie über den Chrome-Browser zugegriffen, aber es funktioniert nicht wie in der Anleitung gezeigt.

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

html ist:

<!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> 
+0

Wo ist 'this.addCell'? –

+0

die letzte Zeile, graph.addCells ... – hucijiao

Antwort

3

überprüfen Versionen von Abhängigkeiten, insbesondere Lodash. JointJS es mit der Version 4.x

jQuery nicht kompatibel ist: 2.2.4
Lodash: 3.10.1
Backbone: 1.3.3

2

Gerade diese dort zu werfen, aber Sie haben einen Start HTML-Tag?

+0

Dies bietet keine Antwort auf die Frage. Sobald Sie genügend [Reputation] (http://stackoverflow.com/help/whats-reputation) haben, können Sie [jeden Beitrag kommentieren] (http://stackoverflow.com/help/privileges/comment); stattdessen [geben Sie Antworten, die keine Klärung durch den Fragesteller erfordern] (http://meta.stackexchange.com/questions/214173/why-doe-i-need-50-reputation-to-comment-what-can- i-do-stattdessen). - [Aus Bewertung] (/ review/low-quality-posts/14222151) – Nikhil

+0

Ok, danke und sorry. – NormTheThird