jsplumb

Connecting jQuery UI dialogs with a line using JsPlumb

由 怎甘沉沦 提交于 2019-12-10 15:59:17
问题 I am using jQuery plugin called jsPlumb - http://jsplumb.org/jquery/demo.html and I want to connect my jQuery UI Dialogs with lines generated by jsPlumb. But I cant figure out way to do it. I have this source: <div id="okenko1">Tuhle neco je</div> <div id="okenko2">Tuhle je neco jineho</div> When I create dialog from this divs with jQuery UI $("#okenko1").dialog()... And then I do plumb: jsPlumb.connect({source: $("#okenko1"), target: $("#okenko2")}); Its bugged :-D Looks like this http:/

Jsplumb add connection programmatically using endpoints

由 ♀尐吖头ヾ 提交于 2019-12-10 08:47:15
问题 My requirement is like, I am adding two endpoints using jsplumb.addEndPoint for two containers named 'container0' and 'container1'. Now I need to link the two end points using a connector programmatically but the jsplumb.connect creates a new endpoint and connecting and is not using the end point which I have created using jsplumb.addEndpoint . How could I connect these two end points? Also I just want to add a connection if the connection is not already there for the end points? 回答1: To

jsPlumb issue using drag and resize

由 a 夏天 提交于 2019-12-07 14:19:32
问题 I'm using jsPlumb in my project that, basically, build a flowchart, where user can drag and drop a shape from one div to another (#frame). So I want that some shapes are resizable, but I'm having some problems, because when I try to resize the shape, it moves like I was dragging too. I used the jsPlumb.repaint at the resize event, but still messed. /** * Enable element to be resizable at the div '#frame'. * Set a new ID to the element * * @param {Object} elem */ function make_resizable(elem)

jsPlumb issue using drag and resize

由 拥有回忆 提交于 2019-12-05 21:17:28
I'm using jsPlumb in my project that, basically, build a flowchart, where user can drag and drop a shape from one div to another (#frame). So I want that some shapes are resizable, but I'm having some problems, because when I try to resize the shape, it moves like I was dragging too. I used the jsPlumb.repaint at the resize event, but still messed. /** * Enable element to be resizable at the div '#frame'. * Set a new ID to the element * * @param {Object} elem */ function make_resizable(elem) { count_id++; var id_name = "production_" + count_id; // build a new id elem.attr("id", id_name); $("

Jsplumb add connection programmatically using endpoints

由 邮差的信 提交于 2019-12-05 15:20:46
My requirement is like, I am adding two endpoints using jsplumb.addEndPoint for two containers named 'container0' and 'container1'. Now I need to link the two end points using a connector programmatically but the jsplumb.connect creates a new endpoint and connecting and is not using the end point which I have created using jsplumb.addEndpoint . How could I connect these two end points? Also I just want to add a connection if the connection is not already there for the end points? To connect using already existing endpoints you can make use of the Uuid's of the endpoints: jsPlumb.ready(function

jsPlumb: How do I select a specific connector

由 杀马特。学长 韩版系。学妹 提交于 2019-12-05 02:57:24
问题 I can't seem to figure out how to select a specific jsPlumb connector. I know that I can select all the connectors related to source or target, but frequently I will have multiple connectors going between the same source and target so I don't see a way to be able to select a specific connector in that case. My specific use case is as follows: If a user clicks a connector, they are given a dialog that allows them edit the connection. (ie. set the label name, delete the connection). Right now

Extend jsplumb.draggable drag behavior

由 那年仲夏 提交于 2019-12-04 03:47:54
问题 I am sure that I am missing something here, but I would like to extend the drag behavior of a div with jsPlumb.draggable class attributes that is attached to an endpoint, while preserving the jsPlumb.draggable attributes. I would like something like this (adapted from this SO): $('#dragcodes').draggable( { drag: function(){ var offset = $(this).offset(); var xPos = offset.left; var yPos = offset.top; console.log('x: ' + xPos); console.log('y: ' + yPos); } }); on an element that is created

Save and load a flowchart on jsPlumb

由 ╄→尐↘猪︶ㄣ 提交于 2019-12-03 06:08:07
问题 What's the best approach to save and load an flowchart on jsPlumb? 回答1: I managed to save the chart by simply having all the elements inside an array of objects, where each object has source and target nodes, x, y coordinates . When saving, simply do JSON.stringify(whole_object) , and if loading, simply JSON.parse() and manually position the nodes as well as connect them. 回答2: My solution save and load jsPlumb: function Save() { $(".node").resizable("destroy"); Objs = []; $('.node').each

jsPlumb: how to make Flowchart connectors avoid intersecting elements?

由 心不动则不痛 提交于 2019-12-03 04:18:56
问题 Is it possible to make jsPlumb Flowchart connectors not to cross connectable items or specified elements (in the example: elements with 'item' class)? Default Flowchart behaviour: A desired result: Here's what I tried: http://jsfiddle.net/CcfTD/1/ Edited to clarify HTML <div id="root"> <div class="item" id="item1">Item 1</div> <div class="item" id="item2">Item 2</div> <div class="item" id="item3">Item 3</div> <div class="item" id="item4">Item 4</div> <div class="item" id="item5">Item 5</div>

Are there any alternatives to jsPlumb? (for the purpose of connecting DOM elements) [closed]

由 匿名 (未验证) 提交于 2019-12-03 02:44:02
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: I'm making a gantt project management system, and I'm trying to connect the DOM elements of a UI together, like in this jsPlumb demo : However, I don't like jsPlumb much. I searched for alternatives, but couldn't find any. Are there any jsPlumb alternatives that you suggest? 回答1: jsPlumb doesn't have a Gantt chart connector out of the box, but someone wrote one a year or two ago: http://help-me-hackers.com/tasks/107 which, when i saw it, i thought was pretty cool. I don't know a great deal about it, since it's all in Japanese, but the idea
订阅 jsplumb