Drawing shapes on a canvas with respect to x and y co-ordinates?

[sairam39]

Hi there,
This is Sai.

https://developer.mozilla.org/en-US/docs/HTML/Canvas/Tutorial/Drawing_shapes

In my web application as a user I will put some points on the bar chart(which contains X and Y axis) and then when I click on button all the points should join & form a shape and when I drag and drop that particular shape to other place in that bar chart it should able to read the chart coordinates and I can able to resize that shape.
Like this there are many shapes in that bar chart.
How to do this??

I don't know any charting mechanism for bar charts which allows us to create movable,resizeable shapes that is why I have taken table and divided each <td> like a block so that each <td> contains an id its row and column no
for example row 2 nd and column is 5
then its id is 25.

I have taken HTML5 as the basic things to draw irregular shapes and to drag and drop and resize the shapes which are placed on canvas.and canvas is placed on table.
User will put some points on the graph(table) and then when he clicks a button called “Plot”, a shape is formed by connecting all the points, like this user can create as many number of shapes he wants(please check the attached screen shot.
Now after creating shapes user can also drag them to other place in the chart in order to do this canvas is becoming obstacle because canvas size is larger than one particular shape so when I am trying drag and drop entire canvas is moving and same time I am unable to read the co-ordinates because shapes are not moving directly on table but those are drag and dropping on canvas which is invisible.

So how can get rid of this???

If you observe the above link mentioned, I am also expecting same output(image ) but what I want is the shape can be anything and that can be drag and drop on that canvas and while drag and drop, I should able to capture the present co-ordinates ???


Can anyone give me your valuable suggestions.

[Rabbit]

You didn't attach the screenshot you said you would attach.

I haven't used a canvas before but for those who have and who can help you, they would need to see your code.