новичку: привет мир с помощью jointjs

Здравствуйте Im пытается выполнить привет мир приложений с использованием библиотеки JointJS, как указано в: http://www.jointjs.com/tutorial#hello-world Я скачал joint.js и joint.css файлы Я скопированный код, указанный в HelloWorld учебник в формате HTML файл и доступ к нему из браузера firefox (26.0) Но его работа не работает должным образом и показана в учебнике. Ожидается: должны появиться две коробки со связями. Фактически: в браузере ничего не происходит. Ошибка отладки Атер является: "NS_ERROR_FAILURE:" в joint.js на:новичку: привет мир с помощью jointjs

var bbox = this.el.getBBox();

код:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<link rel="stylesheet" href="joint.css" /> 
<script src="joint.js"></script> 
</head>   

<body> 

<script type="text/javascript"> 
var graph = new joint.dia.Graph; 

var paper = new joint.dia.Paper({ 
    el: $('#myholder'), 
    width: 600, 
    height: 200, 
    model: graph 
}); 

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>

С уважением Ранганат

источник

2014-01-20 user3214974

Не могли бы вы показать свой код? –

@Roy код добавлен сейчас – user3214974

Вы упускаете держатель для объекта бумаги , Добавьте следующий сразу после открытия <body> тега:

<div id="myholder"></div>

источник

2014-01-21 08:25:40 dave

Спасибо @Dave, его работа отлично. – user3214974

Вы можете попробовать этот код. Пожалуйста, добавьте jquery.min.js lodash.min.js backbone-min.js

<!DOCTYPE html> 
    <html> 
    <head> 
    <meta charset="UTF-8"> 
    <link rel="stylesheet" href="joint.css" /> 
    <script src="joint.js"></script> 
    <script src="jquery.min.js"></script> 
    <script src="lodash.min.js"></script> 
    <script src="backbone-min.js"></script> 
    </head>   

    <body> 
    <div id="myholder"></div> 
    <script type="text/javascript"> 
    var graph = new joint.dia.Graph; 

    var paper = new joint.dia.Paper({ 
     el: $('#myholder'), 
     width: 600, 
     height: 200, 
     model: graph 
    }); 

    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>

источник

2016-07-25 03:28:01

Добавьте некоторое описание, просто вставьте код, как обычно. – piyushj

новичку: привет мир с помощью jointjs

ответ

Смежные вопросы