WebGL Heatmap

This layer renders vector data as a heatmap using WebGL as the render engine. The layer is coordinated with all other map and chart functionality. It is implemented to be completly interoperable with the regular OpenLayers heatmap. This means that the colorization of the heatmap is relative, and weighted either by properties or number of points at a given area. A regular heatmap from openlayers are so slow that they cannot support 1000s of features let alone millions, while this supports an almost arbitary amount of particles. 
// Set up datasource for heatmap (Earthquakes)
var heatmapSource = Sintium.dataSource({
    source: "https://sintium.no/quakes.csv",
    csvHasHeader: true,
    useCrossfilter: true
});

// Create heatmap from datasource
var heatmapLayer = Sintium.heatmapLayer({
    layerId: "Earthquakes",
    dataSource: heatmapSource,
    latProperty: 'latitude',
    lonProperty: 'longitude',
    valueProperty: 'mag',
    info: 'Heat map layer'
});

// Set up a light and dark base map
var lightBaseLayer = Sintium.baseLayer({
    layerId: "World Map Light",
    layer: Sintium.getDefaultLightTileLayer(),
    darkLayer: Sintium.getDefaultDarkTileLayer()
});

// Set up the map with layers and extensions
var map = Sintium.map({
    domId: "map",
    layers: [baseLayer, heatmapLayer],
    use: []
});

// Set up line chart to select richter magnitude range
var lineChart = Sintium.lineChart({
    domId: "line-chart",
    dataSource: heatMapSource,
    height: 125,
    xAxis: "mag",
    xRange: [0, 10],
    elasticY: true,
    brushOn: true
});

<div id="map" style="width: 100%; height: 500px;"></div>
<div id="line-chart" style="width: 100%;"></div>