I am embedding a Power BI report with a single page and single view in to my application using javascript.The visual is creating and loading fine but it is occupying in a particular portion of the parent div in which i am embedding my report.I need to stretch that visual into full width and height of the parent div.I tried this but it is not working for me.

Here is my current output

Here my visual is fit in to the centre of my parent div but i need to stretch that visual to cover all remaining red portion of my parent div

Here is my code

  let visualConfig = {
    type: 'report',
    tokenType: models.TokenType.Aad,
    accessToken: loggedInUser.accessToken,
    embedUrl: globalData.embedUrl,
    id: globalData.id,
    viewMode: models.ViewMode.View,
    permissions: models.Permissions.ReadWrite,
    datasetBinding: {
        datasetId: CurrentDataset
    },
    settings: {
        //layoutType: models.LayoutType.Custom,
        //customLayout: {
        //    pageSize: {
        //        type: models.PageSizeType.Custom,
        //        width: $("#idViewPreview").width(),
        //        height: 300
        //    },
        //    displayOption: models.DisplayOption.FitToPage
        //},
        panes: {
            filters: {
                visible: false
            },
            pageNavigation: {
                visible: false
            },

        },
        background: models.BackgroundType.Transparent,

        visualSettings: {
            visualHeaders: [
                {
                    settings: {
                        visible: false
                    }
                }
            ]
        }
    }
};

currentVisual.report = powerbi.embed($("#idViewPreview")[0], visualConfig);

//required for untag load event
currentVisual.report.off("loaded");

// Triggers when a report schema is successfully loaded
currentVisual.report.on("loaded", async function () {
    try {
        var newPage = await currentVisual.report.addPage("test_display");
        currentVisual.page = newPage;
        currentVisual.page.setActive();

        let models = window['powerbi-client'].models;

        const customLayout = {
            x: 0,
            y: 0,
            width: 1000,
            height: 800,
            displayState: {
                // Change the selected visuals display mode to visible
                mode: models.VisualContainerDisplayMode.Visible
            }
        };

        currentVisual.visuals = await currentVisual.page.createVisual("funnel", customLayout);
    }
    catch (ex) {
        console.log(ex);
    }