scroll event not consumed when used for zoom in chart view

[x-a-a-d]

When trying to zoom the chart by using mouse wheel it works, but if the page is "scrollable" it also scrolls the page. It seems that event is not "consumed" by the PlotView.

[byte-byte-byte]

Have you solved your problem? I had the same problem, The Web console output "[Intervention]Unable to preventDefault inside passive event listener due to target being treated as passive."

[Apflkuacha]

In my project I also had this issue, as a workaround I used following script in the body part of the file App.razor:

<script>
    function preventScrolling(element) { element.addEventListener("wheel", function (e) { e.preventDefault() }); }
</script>

And following is in my Graph.razor:

<div @ref="componentContainer">
    <BlazorPlotView Width="100%" Height="70vh" Model="plotModel" ReverseMouseWheel="true" />
</div>

@code {
    [Inject] IJSRuntime JSRuntime { get; set; } = null!;
    private ElementReference componentContainer;
    private PlotModel plotModel = new PlotModel { Title = "", Background = OxyColor.FromRgb(255, 255, 255) };

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        await base.OnAfterRenderAsync(firstRender);
        if (firstRender)
        {
            await JSRuntime.InvokeVoidAsync("preventScrolling", componentContainer);
        }
    }
}

Unfortunatly I do not know how to properly implement it in this project, but maybe someone else creates a pull request with a fix.

[Apflkuacha]

A easier solution I would prefer would be following, but for any reason it doesn't work?!

AddEventCallback<WheelEventArgs>(builder, 13, "onwheel", e => ActualController.HandleMouseWheel(this, TranslateWheelEventArgs(e)), preventDefault: true, stopPropagtion:true);

This line in the file BlazorPlotView.cs, inside the method BuildRenderTree would be a nice solution, but the preventDefault doesn't have the effect that it stops scrolling when defined there..