-4

i have searched a lot but i couldn't implement above scenario. Basically i need two requirements for my project. 1st is once a object or image dragged on to the canvas, and when the mouse clicks it should show connecting points around the dragged object. and then objects should be able to connect each other when dragging one of those connecting points to another. You can check the following application which is done using html5 and silverlight. but i need to do it with html5 and any other javascript library. http://grapholite.com/ . I would be very much grateful if anyone can help me on this.I checked the following program as well but its not sufficient for my requirement. because the connecting should happen by connecting nodes. Connect canvas with lines

Community
  • 1
  • 1
user3139982
  • 1
  • 3
  • That code link does most of what you need. Please show the connecting code you have tried and are having problems with. – markE Feb 15 '14 at 16:24
  • Hi mark i do not have a working code and i was playing around with your code. I do not need the lines to be drawn initially. But when the user double clicks a rectangle , rectangle should have connecting points. and by dragging a connecting point user can draw a arrow or line. Do you have a idea to achieve this? Thanks – user3139982 Feb 16 '14 at 03:46
  • I'd be glad to help. What have you got so far? – markE Feb 16 '14 at 03:47
  • sorry but i haven't got a code to show at the moment. If you can suggest me some ideas then it would be helpful. Thanks – user3139982 Feb 16 '14 at 03:57
  • 1
    I have confidence in you. Try making some code! – markE Feb 16 '14 at 04:06
  • Possible duplicate of [Drawing a line between two divs](https://stackoverflow.com/questions/6278152/drawing-a-line-between-two-divs) – balupton Nov 05 '18 at 21:04

2 Answers2

0

See also this question, which references the excellent JsPlumb.

The community edition fully answers your question. Take a look at the perimeter anchors demo.

Community
  • 1
  • 1
Mawg says reinstate Monica
  • 38,334
  • 103
  • 306
  • 551
-1

Judging by your question I think concept of anchor points will be helpful...Take a look at this...... http://www.html5canvastutorials.com/labs/html5-canvas-modify-curves-with-anchor-points-using-kineticjs/

Pratik.S
  • 470
  • 10
  • 30