![]() To be able to overwrite the cropper coordinates, you can use this input. When the resizeToWidth or resizeToHeight is set, enabling this option will make sure smaller images are not scaled up Step size can then be changed by using the numpad when the cropper is focused The initial step size in pixels when moving the cropper using the keyboard. The cropper cannot be made bigger than this number of pixels in height (in px) The cropper cannot be made bigger than this number of pixels in width (in px) The cropper cannot be made smaller than this number of pixels in height (relative to original image's size) (in px) (will be ignored if maintainAspectRatio is set) The cropper cannot be made smaller than this number of pixels in width (relative to original image's size) (in px) Set Cropper Height and disable resize (in px) Set Cropper Width and disable resize (in px) When set to true, padding will be added around the image to make it fit to the aspect ratioĬropped image will be resized to at most this width (in px)Ĭropped image will be resized to at most this height (in px) Keep width and height of cropped image equal according to the aspectRatio Output format (png, jpeg, webp, bmp, ico) (not all browsers support all types, png is always supported, others are optional) If requesting an image from a different domain make sure Cross-Origin Resource Sharing (CORS) is allowed or the image will fail to load. If you don't want to use a file input or a base64 you can set an URL to get the image from. If you don't want to use a file input, you can set a base64 image directly and it will be loaded into the cropper The file you want to change (set to null to reset the cropper) The change event from your file input (set to null to reset the cropper) Either the imageChangedEvent, imageBase64 or imageFile should be set to load an image into the cropper. That event is then passed to the image cropper through imageChangedEvent which will load the image into the cropper.Įverytime you release the mouse, the imageCropped event will be triggered with the cropped image as a Base64 string in its payload. When you choose a file from the file input, it will trigger fileChangeEvent. ![]() Example usageĪdd the ImageCropperModule to the imports of the module which will be using the Image Cropper. Only Angular 13 is supported since image cropper version 6.0.0. Npm install ngx-image-cropper -save Upgrade instructionsįor a list of breaking changes and update instructions, go to releases.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |