Drawing Rectangle And Square Using Same Function In Javascript

I want to draw both rectangle and square using same var rectangle in my program. I have modified the function to draw square, given modeOptions = { 'Rectangle', 'Square' } what nee

Solution 1:

To force the resulting rectangle to be only a square, you need to modify your rectangle mousemove method.

The modification would enforce that this is always true:

Math.abs(obj.maxx-obj.minx) ==  Math.abs(obj.maxy-obj.miny).

It’s up to you to determine how your want to enforce that result.

For example, assuming upPos is right and down from downPos:

You could let the horizontal length win:

obj.maxy = obj.miny+(obj.maxx-obj.minx);

You could let the vertical length win:

obj.maxx = obj.minx+(obj.maxy-obj.miny);

You could even let the minx/miny float to create a square:

obj.minx = obj.maxx – (obj.maxy-obj.miny);

//  or 

obj.miny= obj.maxy – (obj.maxx-obj.minx);