Skip to content

Destination rectangle incorrect on image() with dx,dy, dWidth, dHeight #5200

@lisajamhoury

Description

@lisajamhoury

Most appropriate sub-area of p5.js?

  • Accessibility (Web Accessibility)
  • Build tools and processes
  • Color
  • Core/Environment/Rendering
  • Data
  • DOM
  • Events
  • Friendly error system
  • [x ] Image
  • IO (Input/Output)
  • Localization
  • Math
  • Unit Testing
  • Typography
  • Utilities
  • WebGL
  • Other (specify if possible)

Details about the bug:

  • p5.js version: 1.2.0
  • Web browser and version:
  • Chrome
    89.0.4389.128 (Official Build) (64-bit) (cohort: Stable)
  • Operating System:
  • Windows Version 10.0.19042 Build 19042
  • Steps to reproduce this:

I am using the dx,dy,dWidth,dHeight options in image() to copy a part of the webcam and place it on the canvas. The image appears too large. Interestingly if I add tint(255) ahead of the image it displays properly.

See this sketch for a reproduction of the issue: https://editor.p5js.org/lisajamhoury/sketches/fz9-4pWCJ

The sketch should show the webcam mirrored, but the image on the left is not correct.

If you comment in line 27 to add the tint, the error is fixed.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions