jsplumb

Can we export a JsPlumb flowchart as a JSON or XML?

由 匿名 (未验证) 提交于 2019-12-03 02:16:02
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: I have created a JSPlumb Flowchart. Now, I want to export this flowchart into its corresponding JSON or XML script to save and perform various operations. What is more compatible ? Either of them is perfectly fine. Please enlighten me on this. The JsPlumb code that I developed (with the help of various sites) is as given below. <html> <head> <title>Example</title> <script type="text/javascript" src="Jquery\jq.js"></script> <script type="text/javascript" src="Jquery\jq-ui.min.js"></script> <script type="text/javascript" src="jsPlumb-master

Get jsPlumb Line Color After SetPaintStyle

由 匿名 (未验证) 提交于 2019-12-03 01:45:01
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: I had sucessfully created a line using jsPlumb. Below is the code: myid_create_line_instance(0, '1px', '#00000'); //A function that creates line instance. function myid_create_line_instance(id, width, color){ jsPlumb_instance[id] = jsPlumb.getInstance(); var id1 = 'myid_templates_editor_line_' + id + '_pair_1'; var id2 = 'myid_templates_editor_line_' + id + '_pair_2'; var endpointOptions = { anchor:'BottomCenter', maxConnections:1, endpoint:['Rectangle',{width:'1px', height:'1px' }], connectorStyle:{lineWidth:width,strokeStyle:color},

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

由 て烟熏妆下的殇ゞ 提交于 2019-12-03 01:39:47
问题 As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance. Closed 7 years ago . 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:

Save and load a flowchart on jsPlumb

由 不羁岁月 提交于 2019-12-02 19:31:15
What's the best approach to save and load an flowchart on jsPlumb ? 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. My solution save and load jsPlumb: function Save() { $(".node").resizable("destroy"); Objs = []; $('.node').each(function() { Objs.push({id:$(this).attr('id'), html:$(this).html(),left:$(this).css('left'),top:$(this).css('top')

jsPlumb: how to make Flowchart connectors avoid intersecting elements?

由 梦想与她 提交于 2019-12-02 17:36:22
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> </div> JS jsPlumb.connect({ source: $('#item2'), target: $('#item7'), anchors: [ "Continuous" ],

Cannot establish connection - source does not exist

由 雨燕双飞 提交于 2019-12-02 16:16:37
问题 I have a simple section in which users can connect from one element to another element as they wish. after connection can be like this. am using jsPlumb for connections. After connections, if the user is satisfied he/she can save it, everything is saved correctly as I want, now when user reload the page connections eg (con_6, con_18) are not displayed. Here is json where the data are saved. { "movies": [ { "left": 237, "top": 99, "movieid": "51" }, { "left": 241, "top": 263, "movieid": "10" }

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

由 风流意气都作罢 提交于 2019-12-02 15:09:09
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? 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 of polishing those connectors up and then adding them to

Cannot establish connection - source does not exist

由 房东的猫 提交于 2019-12-02 09:43:32
I have a simple section in which users can connect from one element to another element as they wish. after connection can be like this. am using jsPlumb for connections. After connections, if the user is satisfied he/she can save it, everything is saved correctly as I want, now when user reload the page connections eg (con_6, con_18) are not displayed. Here is json where the data are saved. { "movies": [ { "left": 237, "top": 99, "movieid": "51" }, { "left": 241, "top": 263, "movieid": "10" }, { "left": 746, "top": 184, "movieid": "12" } ], "connections": [ { "buttonid": "0", "movieid": "12" }

Extend jsplumb.draggable drag behavior

由 。_饼干妹妹 提交于 2019-12-01 18:32:15
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 using: jsPlumb.draggable($(".dragcodes")); Here is an example of what I am trying to do. I want the top

jsPlumb source endpoint does not move when source container is dragged

由 让人想犯罪 __ 提交于 2019-12-01 08:59:51
Using jsPlumb , where bonds are created between subdivs that are inside draggable absolute positioned containers called .project s. These all appear in a large generic container #container Which is set as the default container in the code jsPlumb.Defaults.Container=$("#container"); http://jsfiddle.net/wwc7G/5/ Everything works fine in one end but not the other. That is: When creating 2 absolute positioned .project containers with 1 task div in each Then making 1 bond connection from 1 task to the other. And dragging the .project container with the source end point - the source end point does
订阅 jsplumb