getDrawPos() returns wrong height for clipper-basic

[webnautics]

I'm using
<clipper-basic ref="clipper" class="clipper" :src="item.preview_url" :ratio="ratio" :init-height="initHeight" :init-width="initWidth"></clipper-basic>

Width these values:
item.preview_url - image 1024 * 768 px (for sure!), jpg
ratio - 4/3 (float value)
initHeight - 100
initWidth - 100

When I'm reading this.$refs.clipper.getDrawPos(), I get for
pos.dheight: 769.3001449611606 or 769.3449676382747, ..., it varies..
pos.dwidth: 1024 - always correct!

It results in 1px more on top of the image in return by using:
const canvas = this.$refs.clipper.clip();
return canvas.toDataURL("image/jpeg");

Is there anything wrong on my side?

Thanks for help!

[timtnleeProject]

Hi @webnautics ,
which vuejs-clipper version did you use?

[webnautics]

Hi @timtnleeProject
3.0.4

[timtnleeProject]

Hi @webnautics ,
I found that this is the bug with ratio,
you can change the border to see that: the bigger the border is, the ratio is far more incorrectly.

I might need some time to fix this.

[webnautics]

Thanks a lot, appreciate it!

[timtnleeProject]

Hi @webnautics ,
I published v3.1.0 to fix the wrong layout.

However, I found that it is difficulty to get both precision and the ability of responsive layout.
There's an update at readme, FYI

If you set the clipper to be responsive, for example: put it in a Row, Col system or set its width based on the container's width, you will lose a little bit of precision. The result of the clipper and the clip box position might not be that accurate. If you cannot tolerate the slippage, use fixed width ${width + border*2}px on the clipper component like width: 502px.

[webnautics]

@timtnleeProject
I understand perfectly what you mean!
For me it's ok now, precision is 767.9999589535923 instead of 768. By Math.round(x) I can handle it for now. I think that is enough, otherwise I have to set fixed width as you mentioned..

Thank you! Have a good time!