rotation - How to rotate rectangle without it being cropped -


i created rectangle 1.5 inches x 1.5 inches , add border around outside, when rotate 45 degrees corners cropped shown below. how rotate without being cropped?

before rotation

after rotation

i tested rotating svg shape snap , css. different results between two. app building shape can rotated 0-359 degrees. here shape looks between 2. shape looks nice rotated snap when put in div , rotated css looks bad. guess going need figure out wit larger svg area , center shape in area, issue have 80 different blocks of various shapes , sizes.

svg shape rotated snap svg shape rotated css

if want rotate square, make sure area you're trying rotate in has 1.4 x length of square. basically, want space equal longest diagonal in bounding box of shape (a square simplest, of course).

doing same thing in css, you've got browser taking care of compositing images you, , don't have explicit bounding area of element. if you're doing within svg, have limitation - accomodate it.


Comments

Popular posts from this blog

javascript - jquery or ashx not working -

opencv - DataType<cv::detail::deriv_type>::depth what is it used for -

python 3.x - Mapping specific letters onto a list of words -