added bilinear filtering for drawimage

[enkimute]

Types of changes

• [ ] Bug fix (non-breaking change which fixes an issue)
• [x ] New feature (non-breaking change which adds functionality)
• [ ] Breaking change (fix or feature that would cause existing functionality to change)

Checklist

• [x ] My code follows the code style of this project.
• [ ] My change requires a change to the documentation.
• [ ] I have updated the documentation accordingly.
• [ ] I have added tests to cover my changes.
• [x ] All new and existing tests passed.

Description

[enkimute]

https://en.wikipedia.org/wiki/Texture_filtering#Bilinear_filtering

On Mon, Dec 13, 2021 at 1:27 PM Charles Robertson @.***> wrote:

Sorry. What is bi-linear filtering?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/joshmarinacci/node-pureimage/pull/72#issuecomment-992429029, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABLHMI33VHBL5FCMTX3EGC3UQXRCVANCNFSM4GJ7XPDQ . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

[charlesr1971]

@enkimute Does this help to smooth drawImage() results of a clip. So for instance I have clipped an image, using an arc(), to create a circular avatar. But, it is aliased.

Will your fix, effectively create anti-aliasing?

Thank you 🙏

[enkimute]

Hi Charles,

This fix only affects how pixels are sampled from the source image. It will not help you create anti-aliased clipping masks. (the easiest approach to get that would be to render your image larger, and then downsample)

Regards,

Steven.

On Mon, Dec 13, 2021 at 3:14 PM Charles Robertson @.***> wrote:

@enkimute https://github.com/enkimute Does this help to smooth drawImage() results of a clip. So for instance I have clipped an image, using an arc(), to create a circular avatar. But, it is aliased.

Will your fix, effectively create anti-aliasing?

Thank you 🙏

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/joshmarinacci/node-pureimage/pull/72#issuecomment-992522397, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABLHMI3JAMI6I6O2O4LFX7TUQX5V3ANCNFSM4GJ7XPDQ . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

[charlesr1971]

@enkimute Hi Steven. Thanks for your reply. Well I have created an image at 1200px X 1200px, but when I scale it down, it looks even more pixellated!

My code is:

const scaleX = 0.5;
const scaleY = 0.5;
 
const width = img.width * scaleX;
const height = img.height * scaleY;
 
const resized = PImage.make(width, height, null);
const ctx = resized.getContext('2d');
 
ctx.drawImage(
img,
0,
0,
img.width,
img.height,
0,
0,
width,
height
);