// Data Source

    var dataSource500k = Sintium.dataSource({
        url: "https://sintium.no/data_2018_500k.csv",
        csvHasHeader: true,
        useCrossfilter: true,
        dateFormat: "dd.MM.yyyy",
        lazyLoad: false,
        useThread: true
    });

    // Map

    var layer500k = Sintium.vectorLayer2({
        layerId: "500",
        dataSource: dataSource500k,
        lonProperty: "Lon",
        latProperty: "Lat",
        useThread: true,
        clusterRadius: 150,
        unrollClustersAtZoom: 12,
        clustered: true
    });

    var map = Sintium.map({
        domId: "map",
        layers: [layer500k],
        clustered: true,
        controls: [
            Sintium.fullScreenControl({position: 'top-right'}),
            Sintium.zoomControl(),
            Sintium.mapExportControl({position: 'top-right'}),
            Sintium.drawControl({position: 'top-right'})
        ]
    });
    
    // Charts

    var barChart = Sintium.barChart({
        domId: 'timeline',
        height: 160,
        dataSource: dataSource500k,
        xAxis: "Landingsdato",
        xUnits: "days",
        xRange: [new Date(2018, 1, 1), new Date(2019, 1, 1)],
        elasticY: true,
        showYAxis: false,
        brushOn: true,
        margins: [10, 10, 45, 10],
        useCanvas: true
    });

<div id="map" style="width: 100%; height: 500px;"></div>
<div id="timeline" style="width: 100%; height: 160px;"></div>