CldImage with Next.js

[richard-chang-coder]

Curious question

Currently using the CldImage component I am able to crop the image but wonder is there a way to implement coordinates? When I upload the image I am also using the cropping features so when I render the image I was hoping to render the crop version where I cropped.

I know there is coordinates from the return response just wondering how can I use it.

Thanks

{
    "custom": [
        [
            28,
            7,
            63,
            63
        ]
    ]
}

<CldImage
				src={'publicId'}
				preserveTransformations
				alt="Description of my image"
				crop={{
					width: 1200,
					height: 1200,

					type: 'thumb',
					source: true,
				}}
				width="500"
				height="500"

			/>

[colbyfayock]

@richard-chang-coder currently the crop prop doesn't support coordinates, thats something i need to get added and will try to get to this week

Currently the crop option only allows the width/height as you've noticed as well as Zoom: https://github.com/cloudinary-community/cloudinary-util/blob/main/packages/url-loader/src/plugins/cropping.ts

Created an Issue to track this: #507

Just noting context: https://cloudinary.com/documentation/resizing_and_cropping#fixed_coordinates_cropping

[richard-chang-coder]

Awesome , Thanks 🙏

…

On Thu, Aug 29, 2024 at 12:33 PM Colby Fayock ***@***.***> wrote: @richard-chang-coder <https://github.com/richard-chang-coder> currently the crop prop doesn't support coordinates, thats something i need to get added and will try to get to this week Currently the crop option only allows the width/height as you've noticed as well as Zoom: https://github.com/cloudinary-community/cloudinary-util/blob/main/packages/url-loader/src/plugins/cropping.ts Created an Issue to track this: #507 <#507> Just noting context: https://cloudinary.com/documentation/resizing_and_cropping#fixed_coordinates_cropping — Reply to this email directly, view it on GitHub <#506 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AUXTWVVPDRBC4ROYP7LT6EDZT5EO3AVCNFSM6AAAAABNI7LDD2VHI2DSMVQWIX3LMV43URDJONRXK43TNFXW4Q3PNVWWK3TUHMYTANBYHE2TSNY> . You are receiving this because you were mentioned.Message ID: <cloudinary-community/next-cloudinary/repo-discussions/506/comments/10489597 @github.com>

[colbyfayock]

this was released on 6.12.0

[richard-chang-coder]

Thanks !

…

On Mon, Sep 9, 2024 at 10:21 PM Colby Fayock ***@***.***> wrote: this was released on 6.12.0 — Reply to this email directly, view it on GitHub <#506 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AUXTWVXYSM7ZMCCIXPITMNTZVZJUPAVCNFSM6AAAAABNI7LDD2VHI2DSMVQWIX3LMV43URDJONRXK43TNFXW4Q3PNVWWK3TUHMYTANJZG4YTAOA> . You are receiving this because you were mentioned.Message ID: <cloudinary-community/next-cloudinary/repo-discussions/506/comments/10597108 @github.com>