c# - Image rotation moving resulting image unpredictably -
i've been looking on today , can't work needs.
i have web application let's users drag , drop text/images , sends details server draw pdf. i'm trying enable rotation, can't hold of translatetransform stuff. image in testing prints out great, rotated well, not in correct location. i'm missing how intitial translatetransform changes things , mind shot @ end of day. have draw bitmap first using different graphics instance, , draw bitmap background? on great! thanks!
code:
- i image object browser
- coord x & y of upper corner of image on canvas (990wx1100h) on browser
size h & w of element on browser
bitmap b = new bitmap(wc.openread(i.img)); if (i.rotation != 0) { g.translatetransform(this.canvasdetails.size.width/2, this.canvasdetails.size.height/2); g.rotatetransform(i.rotation); g.drawimage(b, new rectangle(- i.coord.x/2, -i.coord.y/2, i.size.width, i.size.height), 0, 0, b.width, b.height, graphicsunit.pixel, ia); } else { g.drawimage(b, new rectangle(i.coord.x, i.coord.y, i.size.width, i.size.height), 0, 0, b.width, b.height, graphicsunit.pixel, ia); }
edit added translatransform reversal suggested adam, image still drawn in different location.
g.translatetransform(this.canvasdetails.size.width / 2, this.canvasdetails.size.height / 2); g.rotatetransform(i.rotation); g.translatetransform(-this.canvasdetails.size.width / 2, -this.canvasdetails.size.height / 2); g.drawimage(b, new rectangle(-i.coord.x / 2, -i.coord.y / 2, i.size.width, i.size.height), 0, 0, b.width, b.height, graphicsunit.pixel, ia);
examples: browser view
.net drawn version
ok, reworking answer try explain clearer. couple of things know transformations 'accumulate' , rotation transforms happen around origin. explain affect of accumulating (multiplying) transforms, @ example:
//draw ellipse centered @ 200,200 g.drawellipse(pens.red, 195, 195, 10, 10); //apply translate transform - shifts origin 200,200 g.translatetransform(200, 200); //draw ellipse, should draw around first ellipse //because translate tranforms moves our coordinates 200,200 g.drawellipse(pens.blue, -7, -7, 14, 14); //now rotate transform g.rotatetransform(90f); //degree rotate object //now, draw coordinates 0,0 going draw @ 200,200 , rotated 45* //this line vertical, through 200,200, instead of horizontal through 0,0 g.drawline(pens.green, -20,0,20,0); //if add translate, time 50x, translate 50 in x direction //but - because have transforms applied, including 90 rotate, affects translation //so in effect because 50px translation in y, because it's rotated 90* g.translatetransform(50, 0); //so though translated 50x, line draw 50px below last line g.drawline(pens.green, -20, 0, 20, 0);
so case, want draw object centered @ centerpoint , rotated angle. do:
g.translatetransform(-centerpoint.x, -centerpoint.y); g.rotatetransform(angle); g.drawimage(b, -imagesize/2, -imagesize/2, imagesize, imagesize);
you'd need reset transforms additional drawing, can with:
g.resettransform();
if doesn't leave image want it, you'll need check values you're using position it. storing it's center? or top left? etc.
Comments
Post a Comment