Openlayers 6.3.1 ajax white page

Question

When i load openlayers 5 or 6 over ajax (

$.ajax('/url/', function(data){
$('.content').html(data);
});

) html+js then map area is blank.

If i debug over ajax then ol-unselectable div is hidden

when i hit F12 button then it appears visible

all javascript is running

example:

    $.import('/library/openlayers-6/ol.js', {}, '?ver=1');
    $.import('/library/openlayers-6/ol.css', {}, '?ver=1');
    $.import('/library/geocoder/geocoder.css');
    $.import('/library/geocoder/geocoder.js');

    var map, View, view, ol_easeIn, ol_easeOut, Tile, tileLayer, ol_fromLonLat, ol_toLonLat, OSM, Interaction;

    map = ol.Map;        //~ import map from 'ol/map.js';
    Interaction = ol.interaction;        //~ import map from 'ol/map.js';
    View = ol.View;       //~ import View from 'ol/View.js';
    var {easeIn, easeOut} = ol.easing;     //~ import {easeIn, easeOut} from 'ol/easing.js';
    Tile = ol.layer.Tile; //~ import TileLayer from 'ol/layer/Tile.js';
    var {fromLonLat, toLonLat} = ol.proj;       //~ import {fromLonLat} from 'ol/proj.js';
    OSM = ol.source.OSM; //~ import OSM from 'ol/source/OSM.js';
    positions = new ol.geom.LineString([], /** @type {ol.geom.GeometryLayout} */ ('XYZM'));

    Overlay = ol.Overlay;
    ol_easeIn = easeIn;
    ol_easeOut = easeOut;
    ol_fromLonLat = fromLonLat;
    ol_toLonLat = toLonLat;

    var projection = new ol.proj.get("EPSG:900913");

    view = new View({
        center: ol_fromLonLat([android.long, android.lat]),
        zoom: 17,
        maxZoom: 21,
        projection: projection
    });

    tileLayer = new Tile({
        title: "Map",
        source: new ol.source.OSM()
    });

    map = new map({
        target: 'map',
        interactions: Interaction.defaults().extend([
            new Interaction.DragRotateAndZoom()
        ]),
        controls: ol.control.defaults({
            attribution: false,
            zoom: false,
        }),
        layers: [
            tileLayer
        ],
        view: view
    });

what is wrong with that ? NB! i dont want to load outside of ajax

Answer 1

I found the solution. Add code

setTimeout(function(){

        map.updateSize();
        map.render();
    }, 100);