Re: How to use the focal point feature

And to get a good idea of how this works, I found a tool that shows just about what's happening:

https://tiny.pictures/demo/focal-point

\Fabian

Gesendet: Donnerstag, 13. Juli 2023 um 22:04 Uhr

Von: "Fabian Huschka via opencms-dev" <[email protected]>

An: [email protected]

Cc: "Fabian Huschka" <[email protected]>

Betreff: Re: [opencms-dev] How to use the focal point feature

Hi Kai,

From the comments on the Class CmsImageScaler.java

<p>If a focal point is set on this scaler, this mode will first crop a region defined by cx,cy,cw,ch from the original

image, then select the largest region of the aspect ratio defined by w/h in the cropped image containing the focal point, and finally

scale that region to size w x h.</p>

Good to have learned about this feature :)

All the best,

\Fabian

Gesendet: Donnerstag, 13. Juli 2023 um 19:07 Uhr

Von: "Schliemann, Kai via opencms-dev" <[email protected]>

An: "'The OpenCms mailing list'" <[email protected]>

Cc: "Schliemann, Kai" <[email protected]>

Betreff: [opencms-dev] How to use the focal point feature

Hi list,

OpenCms makes it possible to set a focal point in images.

We have a question about that.

We couldn't find any precise instructions on how to use the focal point feature.

The only documentations we found are about how to set a focal point, but we don't know how to use it.

However, we have found that additional (scale) properties are needed to be able to use the function.

We tried this to scale an image with a set focal point:

<cms:scaleImage var="imgBean1" src="${content.value.Image.toImage}?__scale=h:600,w:900,t:8,cx:40,cy:30,ch:600,cw :1500" />

Our questions:

Is there any specific guide on how we can use the focal point feature or can you

describe to us which steps are necessary to achieve an expected result (result = scale image with focal point)?

Are there any settings that we are missing to unlock this function?

A quick example would also be helpful.

In addition, to make our needs clearer, what our use case is:

We have a responsive website with different modules. Let’s say, we have module A, which should render one image in three different image aspect ratios and sizes. One for desktop, tablet and smartphone.

The same image should be used for all three devices.

Every image has, as already mentioned, different sizes and aspect ratios.

For example:

Image desktop: height: 200px, width: 800px

Image tablet: height: 200px, width: 600px

Image smartphone: height: 150px, width: 400px

How can we achieve the output for each device with a focal point set to optimally show the correct part of the image, even with such different image ratios and sizes?

Thanks a lot in advance for your help.

Best regards

Kai

__________________________________________

Kai Schliemann

Dipl.-Wirtschaftsingenieur (FH)

Senior IT-Berater Softwareentwicklung

comundus GmbH

Heerstraße 111, D-71332 Waiblingen

Durchwahl +49 7151 96528-120

Zentrale +49 7151 96528-0

Fax +49 7151 96528-999

E-Mail [email protected]

Internet https://www.comundus.com/

Hinweis Unsere Datenschutzerklärung

Geschäftsführer Siegfried Fitzel, Klaus Hillemeier

Amtsgericht Stuttgart, HRB 264290

__________________________________________

comundus auf:

https://www.facebook.com/Comundus-GmbH-163398933697079/ http://twitter.com/comundus https://www.xing.com/companies/comundusgmbh https://www.youtube.com/channel/UCTTN-c169oHvHDrykuKnMQw

_______________________________________________ This mail is sent to you from the opencms-dev mailing list To change your list options, or to unsubscribe from the list, please visit https://lists.opencms.org/mailman/listinfo/opencms-dev

_______________________________________________ This mail is sent to you from the opencms-dev mailing list To change your list options, or to unsubscribe from the list, please visit https://lists.opencms.org/mailman/listinfo/opencms-dev

_______________________________________________
This mail is sent to you from the opencms-dev mailing list
To change your list options, or to unsubscribe from the list, please visit
https://lists.opencms.org/mailman/listinfo/opencms-dev