Image does not adapt to focusal point - Umbraco version 8.17.0
d
Hello, I'm trying to adapt the focus point of a banner to be able to display other parts of the image on the screen. Umbraco takes the focus into account, i.e. it updates the URL, but the rendering doesn't change. I tried two different ways. The first is to use :
Copy code
csharp
media.Content.GetCropUrl(width, height, quality: quality, imageCropMode: Umbraco.Web.Models.ImageCropMode.Stretch, preferFocalPoint: preferFocalPoint) + "&format=webp"
with preferLocalPoint set to true and the second is to use the Url.GetCropUrl() method:
Copy code
csharp

<div class="hero hero--small">
    @if (heroImage != null)
    {
        <picture class="hero__img">
            <source srcset="@Url.GetCropUrl(heroImage, 2000, preferFocalPoint: true)" media="(min-width: 1900px)">
            <source srcset="@Url.GetCropUrl(heroImage, 1900, preferFocalPoint: true)" media="(min-width: 1800px)">
            <source srcset="@Url.GetCropUrl(heroImage, 1800, preferFocalPoint: true)" media="(min-width: 1700px)">
            <source srcset="@Url.GetCropUrl(heroImage, 1700, preferFocalPoint: true)" media="(min-width: 1600px)">
            <source srcset="@Url.GetCropUrl(heroImage, 1600, preferFocalPoint: true)" media="(min-width: 1500px)">
            <source srcset="@Url.GetCropUrl(heroImage, 1500, preferFocalPoint: true)" media="(min-width: 1400px)">
            <source srcset="@Url.GetCropUrl(heroImage, 1400, preferFocalPoint: true)" media="(min-width: 1300px)">
            <source srcset="@Url.GetCropUrl(heroImage, 1300, preferFocalPoint: true)" media="(min-width: 1200px)">
            <source srcset="@Url.GetCropUrl(heroImage, 1200, preferFocalPoint: true)" media="(min-width: 1100px)">
            <source srcset="@Url.GetCropUrl(heroImage, 1100, preferFocalPoint: true)" media="(min-width: 1000px)">
            <source srcset="@Url.GetCropUrl(heroImage, 1000, preferFocalPoint: true)" media="(min-width: 900px)">
            <source srcset="@Url.GetCropUrl(heroImage, 900, preferFocalPoint: true)" media="(min-width: 769px)">
            <source srcset="@Url.GetCropUrl(heroImage, 768, preferFocalPoint: true)" media="(min-width: 600px)">
            <source srcset="@Url.GetCropUrl(heroImage, 600, preferFocalPoint: true)" media="(min-width: 500px)">
            <source srcset="@Url.GetCropUrl(heroImage, 500, preferFocalPoint: true)" media="(min-width: 400px)">
            <source srcset="@Url.GetCropUrl(heroImage, 400, preferFocalPoint: true)" media="(min-width: 300px)">
            <img class="hero__img" alt="" src="@Url.GetCropUrl(heroImage, 800, preferFocalPoint: true)" />
        </picture>
    }
The return of the method: src="/media/yg0lyqpt/albert_mathier_chais_web.jpg?center=0.024024024024024024,0.066&mode=crop&width=800&rnd=133628250885630000"